Vue.js学习
创建一个vue实例
1. vue.js如何引入到标签中<script>，vue实例与挂载点的绑定方式
2. vue实例与模版的绑定方式
3.插值表达式
另外一种写法：
v-text和v-html的区别：v-text：<h>标签被转义，而v-html：<h>标签不会被转义
4.当点击hello的时候，会弹出一个123提示框，下面的做法是错误的。
成功做法：
5. 当点击hello的时候，hello会变成word
v-on:的简写为@
定义title属性
使用模版指令：v-bind:, 它指的是data: {}里面的属性值
v-bind:可以简写为:
单向绑定：当在input框里面输入值时，数据content里面的值不会发生改变
数据data: {}决定页面的显示，但是页面无法决定数据data: {}里的内容
6. 双向绑定：当在input框里面value值时，数据content里面的值也会发生改变
input不仅可以输入值，还可以显示值，使用value属性就可以显示值，让input的值value与content相同
但是当向input里面再次添加值的时候，下面的div值并没有发生改变
使用v-model:模版指令实现双向数据绑定
当input框里面的数据改变了，数据div里面的值也会发生改变
当数据div里面的值发生改变了，input框里面的值也会发生改变
7. vue中的计算属性和侦听器
双向绑定姓和名，并打印出来
将firstName和lastName属性进行计算得到一个fullName属性
当对姓和名进行任意改变，count就要加1
侦听器：监听某一个数据的变化，一旦发生变化，我们可以在侦听器做业务逻辑
监听全名发生变化，全名中的任意一个属性发生变化，侦听器里面的count都会加1
7. v-if, v-show, v-for指令
v-if:控制dom的存在与否
v-show:控制dom的显示与否
v-for:控制dom的一组数据，通过一组数据的循环显示
如果v-show是true将显示hello world, 如果是false将不显示hello world
当点击toggle时，如果hello world显示，则将它变为不显示
如果hello world没有显示，则将它变为显示
点击toggle
使用v-if和v-show的区别：
v-if:会将div从dom上清除
v-show:不会将div从dom上清除，只是把它的属性变成了none
---------------------------------------------------------------------------------------------------------------------------------
对于v-if:
v-show:
v-for:循环一个数组里面的值
key：可以提高每一项渲染的效率或者渲染的性能
todolist功能开发：
将input值添加到list中，并且循环显示出来
清空input框中的值
组件拆分：
不管提交什么，下面显示的就只有item
当添加完值之后，随便点击一个list里面的值，都会弹出一个提示框
点击它将删除它
emit子组件向外触发，父组件<body>里面得@delete负责监听，然后调用script标签里面实例对象对应的methods方法里面得handleDelete逻辑
子组件：
父组件：
实例对象里面得methods方法里面的handleDelete逻辑
Vue cli的安装和使用：
下载与计算机32/64版本一致的node安装包进行安装，然后检查node, npm版本号，最后安装Vue，通过webpack打包部署Vue代码到线上环境
node -v
npm -v
npm install --global vue-cli
浙公网安备 33010602011771号