“Vue2+Vue3”的版本间的差异

来自姬鸿昌的知识库
跳到导航 跳到搜索
 
(未显示同一用户的25个中间版本)
第48行: 第48行:
  
 
https://v2.cn.vuejs.org/
 
https://v2.cn.vuejs.org/
 +
 +
 +
[https://www.bilibili.com/video/BV1Zy4y1K7SH/?p=3 https://www.bilibili.com/video/BV1Zy4y1K7SH/?p=4]
 +
 +
区分 Vue 的开发环境版本(更多调试信息)和生产环境版本(更小体积、更高执行效率)
 +
 +
vue.js 和 vue.min.js
 +
 +
注意:如果用 vue.min.js,很多情况下出问题会直接异常,不会在 console 输出什么错误信息;用 vue.js 就会输出错误信息,方便开发者调试。
 +
 +
Vue 的开发工具:Devtools
 +
 +
https://devtools.vuejs.org/guide/installation.html
 +
 +
 +
Vue.config
 +
 +
关闭 Vue 在浏览器控制台中的生产提示:<syntaxhighlight lang="html">
 +
    <script>
 +
        Vue.config.productionTip = false //设置为 false 以阻止 vue 在启动时生成生产提示。
 +
    </script>
 +
</syntaxhighlight>注意:现在已经不好使了,新版本中, Vue 一加载马上会执行验证并在控制台提示警告信息,不能保证上面的代码在验证、提示前执行,
 +
 +
所以现在只有直接修改 vue.js 源码:<syntaxhighlight lang="javascript">
 +
productionTip: false,
 +
</syntaxhighlight>才行。
 +
{|
 +
|[[Vue Hello 小案例]]
 +
|-
 +
|[[Vue 模板语法]]
 +
|-
 +
|[[Vue 数据绑定]]
 +
|-
 +
|[[Vue el与data的两种写法]]
 +
|}
 +
 +
 +
 +
 +
 +
[[MVVM模型]]
 +
 +
[[Vue Object.defineProperty]]
 +
 +
[[Vue 理解数据代理]]
 +
 +
[[Vue 中的数据代理]]
 +
 +
[[Vue 事件处理]]
 +
 +
[[Vue 事件修饰符]]
 +
 +
[[Vue 键盘事件]]
 +
 +
[[Vue 姓名案例]]
 +
 +
[[Vue 计算属性]]
 +
 +
[[Vue 创建脚手架]]
 +
 +
[[Vue render 函数]]
 +
 +
[[Vue 脚手架结构]]
 +
 +
[[Vue 非单文件组件]]
 +
 +
[[Vue 组件的几个注意点]]
 +
 +
[[Vue ref 属性]]

2024年8月11日 (日) 08:14的最新版本

尚硅谷 张天禹

https://www.bilibili.com/video/BV1Zy4y1K7SH


https://www.bilibili.com/video/BV1Zy4y1K7SH?p=1

课程简介

1.vue 基础

2.vue-cli(vue 脚手架,专门做工程化开发)

3.vue-router(用于在 vue 当中实现前端路由)

4.vuex(当应用足够复杂时,借助它帮我们保管数据)

5.element-ui(好看的 UI 组件库)

6.vue3


https://www.bilibili.com/video/BV1Zy4y1K7SH?p=2

Vue 是什么?

Vue 是一套用于构建用户界面渐进式 JavaScript 框架。

对于“渐进式”的解释:

Vue 可以自底向上逐层的应用

简单的应用:只需要一个轻量小巧的核心库(压缩完只有100kb)。

复杂的应用:可以引入各式各样的 Vue 插件。


Vue 的特点

https://www.bilibili.com/video/BV1Zy4y1K7SH/?p=3

Vue 官网使用指南

https://cn.vuejs.org/

Vue 2

https://v2.cn.vuejs.org/


https://www.bilibili.com/video/BV1Zy4y1K7SH/?p=4

区分 Vue 的开发环境版本(更多调试信息)和生产环境版本(更小体积、更高执行效率)

vue.js 和 vue.min.js

注意:如果用 vue.min.js,很多情况下出问题会直接异常,不会在 console 输出什么错误信息;用 vue.js 就会输出错误信息,方便开发者调试。

Vue 的开发工具:Devtools

https://devtools.vuejs.org/guide/installation.html


Vue.config

关闭 Vue 在浏览器控制台中的生产提示:

    <script>
        Vue.config.productionTip = false //设置为 false 以阻止 vue 在启动时生成生产提示。
    </script>

注意:现在已经不好使了,新版本中, Vue 一加载马上会执行验证并在控制台提示警告信息,不能保证上面的代码在验证、提示前执行, 所以现在只有直接修改 vue.js 源码:

productionTip: false,

才行。

Vue Hello 小案例
Vue 模板语法
Vue 数据绑定
Vue el与data的两种写法



MVVM模型

Vue Object.defineProperty

Vue 理解数据代理

Vue 中的数据代理

Vue 事件处理

Vue 事件修饰符

Vue 键盘事件

Vue 姓名案例

Vue 计算属性

Vue 创建脚手架

Vue render 函数

Vue 脚手架结构

Vue 非单文件组件

Vue 组件的几个注意点

Vue ref 属性