在Vue亲子成分和非亲子传动部件的讨论

本文介绍了Vue亲子成分和非亲子组件传输值问题，分享给大家，具体如下：

1。如何创建组件

1。创建一个新的组件，如：ODS文件夹下创建一个新的odslist.vue

odslist组件

出口默认{
数据（）{
返回{ }
}，
创建（）{

}，
方法：{

}，
组成：{

}
}
2。引进进口odslist from'ods / odslist vue'into main.js。
三.创建路由对象main.js创建路由规则
const路由器=新VerRouter（{
路线{
{路径： / / odslist ODS，成分：odslist }
}
}）
4。在主成分app.vue集货物的清单
系统会自动帮我们把这个标签到标签的href =# / / odslist ODSrel=nofollow外部

2。如何嵌入在父组件的子组件

1。新的子subcomponent.vue
2。进口的子从'。 /子/子。vue'is引入到父组件
三.组件在父组件中的注册
出口默认{
组成：{
如果属性名称和值相同，则可以缩短
子
}
}
4。在父组件的指定位置写入自定义标签。

三.如何实现父子组件之间的传输

1。父组件传递值的子

1。在子组件的道具：{ 'commentid} /子组件用于接收转移属性名称值的父组件
2。在用户定义的子组件标记父组件集父组件转移值到子组件

2。子值传给父组件

1。在父组件的自定义标签中设置自定义函数
2。在父组件的方法中声明一个函数
GetSubComponentParams（params）{
/ /子组件参数接收参数
this.myparams =参数；
}
三.在子组件传递参数
*参数1：要触发的事件名
*参数2：转移的值
* /
这个发射（'paramschange '，这美元。参数）
如何实现非亲子组件的传递值

非父组件的两个组件没有链接，不能通过此传输，因此我们只能实现通过第三方变量传递值的效果。第三个变量是：
使用一个空的Vue公司的实例为中心事件总线
价值转移步骤：
1。创建一个共同的js组件出口空Vue实例内的组件，如一个新的commonvue.js文件
进口Vue from'vue

出口默认新的Vue的写作方法（） / / ES6

*相当于以下
*
* const总线=新的Vue（）
* module.exports =总线
* /

2。组件A中的传输参数
公共汽车。$发出（'odscount '，这个mycount）
三.在组件B中接收参数
公共汽车。美元（'odscount（odscount）= > {
const oldval = $（# badgeid ）文本（）。

const lastval = parseInt（oldval）+ odscount
console.log（lastval）
$（# badgeid ）的文本（lastval）。
}）

以上是本文的全部内容，希望能对您有所帮助，希望大家多多支持。