美文网首页
vue学习笔记

vue学习笔记

作者: lucky_yy | 来源:发表于2017-06-30 13:52 被阅读0次

    一,两种情况下vue更改数据不会响应

    1.v-for渲染数据时,为数组中某一项直接赋值,数据不会响应。

    list数组中改变第二项数据无响应

                  解决办法:调用Vue.set方法:(需在当前组件中引用vue)

    可实现数据响应

    2,改变数组的长度,数据不会响应。

    二,组件中props,$emit用法实例:

          1.props

    子组件

    子组件中需要用到父组件中的参数,就需要用props属性来申明一些变量,去获取父组件中要传的值。

    父组件引用子组件

    2.$emit

    $emit官方解释

    实例用法:

    子组件 父组件自定义事件 a为子组件传到父组件的参数

    三,slot插槽用法

      父组件需要在子组件的标签内添加其他标签,子组件可在标签内加入<slot></solt>,那么父组件中添加的内容就会放在slot标签内。如图:

    子组件 父组件 效果图

    注:若子组件有多个插槽则可为每个插槽取个名字去匹配父组件中增加的标签。若匹配不到,则父组件中没匹配到的标签不显示。

    四,v-bind绑定的值会随值的变化发生动态的响应

    五,组件在调用的时候要将驼峰改为横线的写法,如comA改为<com-a>,标签中的属性自定义事件最好也是小写加中线的模式

    六,v-model和v-on中可以添加修饰器,v-model.lazy和number,trim,以及v-on

    七,transition动画在,v-show,v-if,component:is="aa",路由变化中生效,如果相同标签进行动画切换时,需要增加key属性进行区分,动画才生效。

    八,路由的三种写法

    相关文章

      网友评论

          本文标题:vue学习笔记

          本文链接:https://www.haomeiwen.com/subject/chxmcxtx.html