摘要:
Vue ref 用于获取组件实例 <template> <div id="app"> <HelloWorld ref="ref1" /> <h1 @click="show">点我输出ref</h1> </div> </template> <script> import HelloWorld from 阅读全文
摘要:
let a = { n: 1 } a.x = a = { n: 2 } console.log(a.x); /** 这道题打印undefined 第一行 开辟了堆内存o1, 存储{n:1} 第二行 a.x 指向后续的运算结果, 即此时o1.x = undefined a = {n:2}, 即开辟了堆 阅读全文
摘要:
Vue生命周期 生命周期中的this指向vm或者组件实例对象 一般用的多的就mounted和beforeDestroy 挂载流程 new Vue() → beforeCreate 初始化生命周期和事件,但事件代理还未开始 无法通过vm访问data中的数据,methods中的方法 → created 阅读全文
摘要:
自定义指令 何时调用? 指令所在的模板被解析时(如初次渲染,以及后续模板更新) 函数式 在vm实例的directives属性中,可以拿到element和bindings两个形参 对象式 bind 指令与元素建立联系 inserted 指令插入到页面 update 指令所在模板更新时调用 指令函数中的 阅读全文
摘要:
过滤器 只适用于简单逻辑的处理,复杂逻辑不建议使用 配置 // 全局过滤器 Vue.filter('filter',function(value,arg){ return true }) // 局部过滤器 new Vue({ data:{}, filters:{ filter:function(){ 阅读全文
摘要:
Vue指令 内置指令 自定义指令 内置指令 v-show v-if v-text v-html v-cloak v-once v-pre v-text 向标签插入文本,标签也会当成文本解析 v-html 可以识别文本中的标签 容易导致XSS攻击 如果用,建议用在可信的内容上,而不是用户提交的内容上 阅读全文
摘要:
列表渲染 可以遍历数组,对象,字符串以及指定次数 demo <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initia 阅读全文
摘要:
条件渲染 v-show 实质上是display:none,适用于切换频繁的场景 v-show可以拿到dom, v-if不一定 v-if 实质上是dom的增删,适用于切换不频繁的场景 写法: v-if v-else-if v-else template template只能和v-if一起使用,不能和v 阅读全文
摘要:
Vue样式 绑定class样式 bind字符串形式 bind对象形式 arr数组形式 内联样式 styleObj对象 styleArr数组 demo <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name=" 阅读全文
摘要:
Vue watch 主要用于监听属性的变化,去做一些类似发送请求这样的工作 可以拿到变化前后的属性值 可以检测对象深层次属性以及是否在初始化就触发 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="v 阅读全文