美文网首页
单项数据流

单项数据流

作者: MC丶逗逼嘿 | 来源:发表于2017-09-29 10:02 被阅读0次

什么是单向数据流?

数据从父组件传递给子组件,只能单向绑定。在子组件内部不应该修改父组件传递过来的数据。

子组件不能直接修改由父组件传递过来的数据

子组件修改父组件传递过来的数据的两种方式:

1,子组件通过data修改父组件传递过来的数据,把传递过来的数据作为data中局部数据的初始值使用:

2,子组件通过computed计算属性来修改父组件传递过来的数据

如何在子组件改变属性值的时候,父组件也同步修改?

props验证

组件可以为props指定验证要求,如果未通过验证要求,Vue会发出警告

propsA:Number(指定类型)

propsB:[Number, String](多种类型)

propsC:{type: String, required: true}(必传值,且为字符串)

propsD:{type:Number, default: 100} (字符串类型,默认值为100)

propsE:{type: Number, default: function() {return 1000}}

自定义验证规则:

propsF:{validator: function(value){return value>10}}

验证类型为原生构造器:String,Number,Function,Object,Boolean,Array

相关文章

  • 单项数据流与Vuex

    单项数据流 单向数据流(Unidirectional data flow)方式使用一个上传数据流和一个下传数据流进...

  • 2018-04-02

    vuex(二) 文档中给出了一个vuex的“单项数据流”的图,证明vuex依然遵循vue.js单项数据流的特点,代...

  • 单项数据流

    {{msg}} //先判断作用域内部是否有子元素function isChild(...

  • 单项数据流

    什么是单向数据流? 数据从父组件传递给子组件,只能单向绑定。在子组件内部不应该修改父组件传递过来的数据。 子组件不...

  • react基础

    react 特点 单项数据流 非纯粹mvvm框架 react 元素 与组件的区别 react element 是什...

  • 轻提示的封装和父子通信

    1. 轻提示的封装 (1)时长(2)关闭(3)token 2. props和computed(vuex单项数据流)...

  • Vue props单项数据流

    {{message}} 修改父组件的数据