vue组件传值
父传子首先,在父组件的页面中引入子组件。message为名字(随意取),problemTitle为父组件里面的属性,即需要向子组件传的值。父组件中代码:<children :message="problemTitle"></children>子组件代码:props: ["message"](不要写在data中)(message为在父组件中...
·
父传子
首先,在父组件的页面中引入子组件。
message为名字(随意取),problemTitle为父组件里面的属性,即需要向子组件传的值。
父组件中代码:
<children :message="problemTitle"></children>
子组件代码:
props: ["message"]
(不要写在data中)(message为在父组件中取得名字)
子传父
子组件需要向父组件抛发一个值
子组件代码:
this.$emit("showProblemDetail", this.qs) (showProblemDetail为起的名字)
父组件代码:
<BeginToUse v-on:showProblemDetail="getMsgFormSon"></BeginToUse> (showProblemDetail为在子组件中起的名字)
methods:{
getMsgFormSon (data) {
data为子组件抛发的值
},
}
兄弟组件传值
兄弟组件传值通过bus,即vue实例
首先,需要建一个bus.js。
内部代码如下:
import Vue from "vue";
export default new Vue();
需要传值的组件代码如下:
Bus.$emit("txtStatus", "3");
txtStatus为名字
接收传值的代码如下:
Bus.$on("txtStatus", function (val) {
val即为传过来的值
});
注意:bus指向vue实例,与当前组件的this指向不同!!!
更多推荐
已为社区贡献14条内容
所有评论(0)