Vue.js的常见问题

1、响应式属性和方法
  每个Vue实例都会代理其data对象里所有的属性。
      var data={a:1}
      var vm=new Vue({data:data})   
      vm.a===data.a // -> true  设置属性也会影响到原始数据
      vm.a=2
      data.a        // -> 2     ... 反之亦然
      data.a=3
      vm.a          // -> 3
  即:都可以使vm.xxx这种方式获取和修改实例属性。
  注意:
    只有这些被代理的属性是响应的
    如果在实例创建之后添加新的属性到实例上,它不会触发视图更新
    那么这种情况的话,可以使用VueJs的vm.$xxx的方式来修改实例属性,这同样会触发视图更新,响应式的改变

2、生命周期钩子
  生命周期钩子包括created、beforeCompile、compiled、ready、beforeDestroy、destroyed
  钩子的this指向调用它的Vue实例
  我们可以在钩子的方法中使用this来指代当前实例。
  Vuejs中没有控制器的概念,组件的自定义逻辑可以分割在这些钩子里面

3、插值
  单词插值,只有在第一次渲染时候渲染值,之后不会随实例属性值的变化而改变
  插入原始HTML,这种方式内容以 HTML 字符串插入,数据绑定将被忽略
  如果需要复用模板片断,应当使用partials
  注意:
    在网站上动态渲染任意HTML是非常危险的,因为容易导致XSS攻击

4、v-show 和 v-if的选择
  v-if:
    v-if是惰性的,如果在初始渲染时条件为假,则什么也不做——在条件第一次变为真时才开始局部编译(编译会被缓存起来)
  v-show:
    相比之下,v-show简单得多——元素始终被编译并保留,只是简单地基于css切换

6、prop数据绑定
  prop默认是单向绑定
    当父组件的属性变化时,将传导给子组件,但是反过来不会
    这是为了防止子组件无意修改了父组件的状态——这会让应用的数据流难以理解
  解决办法:
    使用.sync或.once绑定修饰符显式地强制双向或单次绑定
  即:
    1.单向绑定(prop数据默认为单向绑定)
        <child :msg="parentMsg"></child>
    2.双向绑定
        <child :msg.sync="parentMsg"></child>
    3.单次绑定
        <child :msg.once="parentMsg"></child>

7、组件的父链
  子组件可以用this.$parent访问它的父组件
  根实例的后代可以用this.$root访问它
  父组件有一个数组this.$children,包含它所有的子元素

更多免费技术资料可关注:annalin1203

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值