组件间的传值
问题
说一下组件间的传值方式,你知道的所有方式都说一下
问题描述
这个问题其实就是想看官方文档有没有具体看过,因为很多传值方式官方文档上有描述,但是项目中用的相对较少。
基本都能回答上来,父传子:props;子传父:$emit;兄弟:eventbus;vuex;有一些会说到sessionStorage和localStorage、路由传参(这个答案其实并不是我想要问的,不过也可以实现一定的传值)
期望答案
provide / inject
这对选项需要一起使用,以允许一个祖先组件向其所有子孙后代注入一个依赖,不论组件层次有多深,并在起上下游关系成立的时间里始终生效。
Vue.observable
让一个对象可响应。Vue 内部会用它来处理 data 函数返回的对象。
返回的对象可以直接用于渲染函数和计算属性内,并且会在发生改变时触发相应的更新。也可以作为最小化的跨组件状态存储器,用于简单的场景:
const state = Vue.observable({ count: 0 })
const Demo = {
render(h) {
return h(‘button’, {
on: { click: () => { state.count++ }}
}, count is: ${state.count}
)
}
}
a
t
t
r
s
包
含
了
父
作
用
域
中
不
作
为
p
r
o
p
被
识
别
(
且
获
取
)
的
特
性
绑
定
(
c
l
a
s
s
和
s
t
y
l
e
除
外
)
。
当
一
个
组
件
没
有
声
明
任
何
p
r
o
p
时
,
这
里
会
包
含
所
有
父
作
用
域
的
绑
定
(
c
l
a
s
s
和
s
t
y
l
e
除
外
)
,
并
且
可
以
通
过
v
−
b
i
n
d
=
"
attrs 包含了父作用域中不作为 prop 被识别 (且获取) 的特性绑定 (class 和 style 除外)。当一个组件没有声明任何 prop 时,这里会包含所有父作用域的绑定 (class 和 style 除外),并且可以通过 v-bind="
attrs包含了父作用域中不作为prop被识别(且获取)的特性绑定(class和style除外)。当一个组件没有声明任何prop时,这里会包含所有父作用域的绑定(class和style除外),并且可以通过v−bind="attrs" 传入内部组件——在创建高级别的组件时非常有用。
l
i
s
t
e
n
e
r
s
包
含
了
父
作
用
域
中
的
(
不
含
.
n
a
t
i
v
e
修
饰
器
的
)
v
−
o
n
事
件
监
听
器
。
它
可
以
通
过
v
−
o
n
=
"
listeners 包含了父作用域中的 (不含 .native 修饰器的) v-on 事件监听器。它可以通过 v-on="
listeners包含了父作用域中的(不含.native修饰器的)v−on事件监听器。它可以通过v−on="listeners" 传入内部组件——在创建更高层次的组件时非常有用。
props
$emit
eventbus
vuex
$parent / $children / ref