vue学习的最好材料 ：官方文档
知识点：
声明式渲染
1. vue应用 所有东西都是
响应式的。
直接在控制器中修改 变量 的值 ，能看到相对应的更新
问题：这样会不会不严谨，别有用心的人会不会直接找到变量然后修改数据？
2.
绑定元素特性： 1. 文本插值 {{ message }} 2.绑定元素属性特性 v-bind:title=”message“
条件与循环
v-if="" v-for=""
1. 数据可以绑定在：文本，属性，dom结构。
2. Vue 强大的过滤效果 在插入、更新、移除元素时 自动应用过滤效果
处理用户输入
v-on :事件监听 --> v-on:click="function(){}" -->方法写到methods里面
v-model="变量" -->实现表单输入和应用状态之间的双向绑定 -->input里面value值的双向绑定
注意：
在方法中，我们更新应用状态，但没有触碰dom元素，所有的操作都有vue处理，编写的代码只需要关注逻辑层面就行。 ？？？
我的理解：我们在方法中，修改变量或者状态，并没有去触碰dom元素，所有的操作由vue处理。----vue怎么处理，就不清楚了（我的理解不一定对，欢迎更正！！！）
* 组件化应用构造（vue思想）
抽象，组件（小型，独立，可复用），大型应用使用多个组件构成。-->组件树
ARE YOU READY?
创建一个实例 --> 所有Vue组件都是Vue实例
var vm= new Vue({
经常用vm表示Vue的实例
//选项
}）
选项列表：
数据与方法
值变化，视图也会变化 （实例创建，data中的所用属性都加到Vue的响应式系统）。
var data = { a: 1 }
var vm = new Vue({
data: data
})
vm.a == data.a
vm.a = 2
data.a
data.a = 3
vm.a
理解：当我们定义的数据发生改变时，Vue实例中创建的data数据也会发生改变，视图也会发生变化。
<
div
id=
"app"
> {{message.a}}
div
>
<
script
src=
"../js/vue.js"
>
script
>
<
script
>
var
data={
a:
'hello'};
var
vm=
new
Vue({
el:
'#app',
data:{
message:
data
} })
script
>
-----------》》
//结果：hello
控制台编写：
data.a='vue'--》 "vue"
vm.message.a='hello vue' --》"hello vue"
Object.freeze( ) ，会阻止修改现有的属性，意味着响应系统无法再追踪变化。
Object.freeze( data ) ;视图将不会再根据我的 data.a赋值 或 实例赋值 发生变化
要是属性刚开始不存在时？ --> 方法 是 在data中设置一些初始值 ，让它变为存在的空值
Vue实例中的属性和方法，都有前缀
$
, 以便用户定义的属性区分开。
vm.$el vm.$data
* 实例生命周期钩子
错题：
1.new
Vue({ }); vue应该是大写开头，
报错：Uncaught ReferenceError: vue is not defined
2.new Vue({
el :"
#app " #忘写了额，记住el里面填写的是选择器
})
3.犯了个傻错误，在methods方法中修改 data的值，忘记赋值。。。导致dom元素修改未成功
4. 创建一个组建
<ol>
<todo-item>todo-item>
ol>
<script src="../js/vue.js">script>
<script>
// 定义名为 todo-item 的新组件 Vue.component('todo-item', {
template: '这是个待办项' })
script>
为什么页面上没有显示上？
还在学习中.....
京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有