![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
文章平均质量分 58
前程韶光
学生
展开
-
Vue自定义指令
关于Vue指令 vue本身为开发者提供了一系列的指令,常见如:v-bind,v-show,同时,vue也允许开发者自定义指令,然而,有的情况下,仍然需要对普通 DOM 元素进行底层操作,这时候就会用到自定义指令。常见比如当输入框加载进页面时自定获取焦点。 如何自定义指令 以上述输入框自定获取焦点为例: Vue.directive('focus', { // 当被绑定的元素插入到 DOM 中时…… inserted: function (el) {//inserted表示当所绑定的元素插入父节点时调用原创 2022-03-20 15:51:21 · 210 阅读 · 0 评论 -
vue非单文件组件
如何定义组件 定义组件(创建组件) const school=Vue.extend({ template:` <div> <div>school组件的div标签</div> <span>school的span标签</span> </div> ` }) 使用模板字符串提高程序可读性 template中的内容就是组件实际上展示的htm原创 2022-01-08 16:14:04 · 97 阅读 · 0 评论 -
vue列表渲染
基本用法 v-for指令: 1.用于展示列表数据 2.语法:v-for="(item, index) in xxx" :key=“yyy” 3.可遍历:数组、对象、字符串(用的很少)、指定次数(用的很少) vue如何检测与更新列表数据 虚拟DOM中key的作用: key是虚拟DOM对象的标识,当数据发生变化时,Vue会根据【新数据】生成【新的虚拟DOM】, 随后Vue进行【新虚拟DOM】与【旧虚拟DOM】的差异比较,比较规则如下: 2.对比规则: (1).旧虚拟DOM中找到了与新虚拟DOM相同的key:原创 2022-01-08 11:55:58 · 170 阅读 · 0 评论 -
vue数据代理
什么是数据代理 数据代理:通过一个对象代理对另一个对象中属性的操作(读/写),通俗一点说就是两个变量a,b,当a发生变化时b也同步变化即成为a是b的代理,本质上需要用到Object.defineProperty函数,通过设置get函数和set函数的方式可以实现数据代理: number=19 student={ } Object.defineProperty(student,'name',{ get(){原创 2022-01-06 22:46:02 · 482 阅读 · 0 评论 -
Object.defineProperty方法
之前没怎么对Object.defineProperty方法做深入了解,就知道可以通过这个方法可以设置对象的属性,现在稍微了解以后,发现还是有不少东西值得记录一下的,所以写下这篇博客。 一、语法 Object.defineProperty(obj, prop, descriptor) obj:需要定义属性的对象 prop:需要定义的属性 descriptor:属性的描述描述符 返回值:返回此对象 [举个例子] let obj = Object.create(null); let descriptor转载 2022-01-06 22:01:17 · 251 阅读 · 0 评论 -
vue动态绑定class
适用类型 需要绑定的class已知,但只有在特定场景下才生效,基本语法: :class="{on:'/msite'===$route.path}" 此处on为需要绑定的class,此处的意思是:如果路由的请求路径为msite,则当前类的class属性生效,通过这种方式可以给路由添加高亮效果 ...原创 2021-12-14 11:19:49 · 1028 阅读 · 0 评论