一、Vue计算属性
1、计算属性是一个属性
2、必须要return
计算属性可以干嘛?
1、计算属性可以解决 v-for和v-if不支持写在一起的问题
2、计算属性具有缓存数据的效果 利于提高减少性能消耗
3、只有data中的属性的值发生了变化 计算属性才会更新
计算属性可以解决 v-for和v-if不支持写在一起的问题
二、侦听器
两种类型:
基本数据类型
引用数据类型
特点:
1、侦听器是一个属性
2、项目中监听路由变化就需要使用侦听器
3、有两个参数 新值和旧值
4、侦听的名字必须跟函数名一样
基本数据类型
引用数据类型 - 深度侦听
固定属性
handler:方法名必须叫handler
deep:深度监听
immediate:一进入页面就执行侦听 true或者false
引用数据类型更简单的写法:
三、组件
全局组件
局部组件
1、全局组件 - Vue.componet
格式:
Vue.componet(" ",{
template:` `
})
组件名使用大写 要使用-分割
也可以缩写使用 / 关闭
需要先写全局组件 再new实例
2、局部组件 - 在实例里 components:
格式:
new Vue({
el: "#app",
// 局部组件
components: {
组件名: {
template: `组件内容`
}
}
})
在实例里面写
多个组件在一起不要缩写
父传子
1、加v-bind传的是变量 不加v-bind传的是字符串
2、要用div包裹下
单向数据流(修改值必须在父组件修改)
直接改父组件的值不会有变化
需要用自定义事件的方法来实现子改父
this.$emit("定义一个方法名字","修改的内容")
安装Vue脚手架
1、建立一个文件夹
2、打开cmd
3、输入命令 npm i @vue/cli -g
4、vue -V 检查版本
5、输入 vue create项目名称
6、选择vue2(默认vue2)直接按回车
7、输入页面提示的两个指令
8、得到页面显示 复制这两个地址 用网页打开
9、页面显示安装完成