资讯专栏INFORMATION COLUMN

使用vue.js开发时的一些坑

kbyyd24 / 820人阅读

摘要:关于响应式的双向绑定是基于响应式来做的,即给一个对象的属性加上方法,在这些方法中处理双向绑定。

关于响应式

vue的双向绑定是基于响应式来做的,即给一个Vue对象的属性加上getter, setter方法,在这些方法中处理双向绑定。但这种方式就会出现下面这些坑

vue的组件化写法真心不好用

举个例子,我写了个svg-icon的基础组件,类似如下:



然后我每个icon都只需要传入不同的路径就可以了,



然而这里就有个问题了,这里有个size属性决定icon的大小,如果我用这种方式来写,那么我每个icon里面都需要声明size这个props,并且在模板上声明,我嘞个去。。。

对象响应式

Vue中的属性如果是Object,或者是数组,数组中有Object,那么这些Object最好在最开始就把所有需要用到的属性都定义一遍,如果在运行中重新添加属性,这个属性并不是响应式的,就不会实现双向绑定,例如:

const vm = new Vue({
    data: {
        a: {
            text: "aaa"
        }
    }
})
vm.a.b = "ccc"

这样的情况,a的b属性不是响应式的,所以不会双向绑定

Date对象

对Date对象的操作不是响应式的

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/79289.html

相关文章

  • 前端开发记录(施工中...)

    摘要:最近在前端开发的过程中踩了不少坑,先记录下来,往后整理路由实例更新里每一次进行路由导航,对应路由的组件都会生成一个新的实例简称,不注意这一点话会掉坑。原因就是此时路由中的不再是第一次创建监听时指向的了。 最近在前端开发的过程中踩了不少坑,先记录下来,往后整理 路由实例更新 vue.js里每一次进行路由导航,对应路由的vue.js组件都会生成一个新的vue实例(简称vm),不注意这一点话...

    zsy888 评论0 收藏0
  • 前端入体验与分享

    摘要:同源策略同源策略是一种约定,由公司年引入浏览器,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到等攻击。 一、Vue变化检测 背景 初始化对象,属性未知;某些事件触发时,对象改变(新增属性),Vue监听不到 原因 Vue.js 不能检测到对象属性的添加或删除,因为Vue.js 在初始化实例时将属性转为 getter/setter,所以属性必须在 dat...

    hss01248 评论0 收藏0
  • 也许你并不需要第三方小程序框架

    摘要:所以在小程序出现之后,一股框架之风也很快的出现,微信小程序刚推出之后,就出现了两个比较出名的小程序开发框架,。 原文地址:https://ant-move.github.io/we... 这里说的去除小程序框架其实并不严谨,因为小程序本身也算是一个框架,而且是一个功能更加完善的框架系统。在前端的概念中,我们一般说一个框架是指一个用来帮助开发者构建用户界面的框架,而小程序框架本身不仅仅包...

    red_bricks 评论0 收藏0
  • 小程序开发点总结

    摘要:整个小程序所有分包大小不超过单个分包主包大小不能超过微信小程序主流框架对比应该算是最早发布的小程序开发框架,提供了类的语法风格和特性,现阶段应该也是应用最广泛的框架吧。不过微信官方为了防止下载离线包的时间过程,也严格限制了小程序包的体积。 那些年我们踩过的坑css样式不能引用本地图片资源,只能引用线上资源(background-image),引用本地图片资源只能用标签。{{}}不能执行...

    lowett 评论0 收藏0

发表评论

0条评论

kbyyd24

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<