File tree Expand file tree Collapse file tree 2 files changed +51
-1
lines changed Expand file tree Collapse file tree 2 files changed +51
-1
lines changed Original file line number Diff line number Diff line change @@ -58,6 +58,56 @@ expect(wrapper.emitted().foo[1]).toEqual([123])
5858
5959你也可以调用 [ ` wrapper.emittedByOrder() ` ] ( ../api/wrapper/emittedByOrder.md ) 获取一个按触发先后排序的事件数组。
6060
61+ ### 从子组件触发事件
62+
63+ 你可以通过访问子组件实例来触发一个自定义事件
64+
65+ ** 待测试的组件**
66+
67+ ``` html
68+ <template >
69+ <div >
70+ <child-component @custom =" onCustom" />
71+ <p v-if =" emitted" >触发!</p >
72+ </div >
73+ </template >
74+
75+ <script >
76+ import ChildComponent from ' ./ChildComponent'
77+
78+ export default {
79+ name: ' ParentComponent' ,
80+ components: { ChildComponent },
81+ data () {
82+ return {
83+ emitted: false
84+ }
85+ },
86+ methods: {
87+ onCustom () {
88+ this .emitted = true
89+ }
90+ }
91+ }
92+ </script >
93+ ```
94+
95+ ** 测试代码**
96+
97+ ``` js
98+ import { shallowMount } from ' @vue/test-utils'
99+ import ParentComponent from ' @/components/ParentComponent'
100+ import ChildComponent from ' @/components/ChildComponent'
101+
102+ describe (' ParentComponent' , () => {
103+ it (" displays 'Emitted!' when custom event is emitted" , () => {
104+ const wrapper = shallowMount (ParentComponent)
105+ wrapper .find (ChildComponent).vm .$emit (' custom' )
106+ expect (wrapper .html ()).toContain (' Emitted!' )
107+ })
108+ })
109+ ```
110+
61111### 操作组件状态
62112
63113你可以在包裹器上用 ` setData ` 或 ` setProps ` 方法直接操作组件状态:
Original file line number Diff line number Diff line change @@ -95,7 +95,7 @@ describe('Actions.vue', () => {
9595
9696这里发生了什么?首先我们用 ` localVue.use ` 方法告诉 Vue 使用 Vuex。这只是 ` Vue.use ` 的一个包裹器。
9797
98- 然后我们用 ` new Vuex.store ` 伪造了一个 store 并填入假数据。我们只把它传递给 action,因为我们只关心这个。
98+ 然后我们用 ` new Vuex.Store ` 伪造了一个 store 并填入假数据。我们只把它传递给 action,因为我们只关心这个。
9999
100100该 action 是 [ Jest 伪造函数] ( https://facebook.github.io/jest/docs/en/mock-functions.html ) 。这些伪造函数让我们去断言该 action 是否被调用。
101101
You can’t perform that action at this time.
0 commit comments