From 883bcace5abfeae55a050b0e650f724a429714e2 Mon Sep 17 00:00:00 2001 From: Jun Yang Date: Tue, 6 Nov 2018 01:19:00 +0800 Subject: [PATCH 1/2] translate: practice/parent-to-child.md, working on #65 --- source/_posts/en/practice/parent-to-child.md | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/source/_posts/en/practice/parent-to-child.md b/source/_posts/en/practice/parent-to-child.md index ad95af3..8cdfef3 100644 --- a/source/_posts/en/practice/parent-to-child.md +++ b/source/_posts/en/practice/parent-to-child.md @@ -1,12 +1,12 @@ --- -title: 父组件如何更新子组件? +title: How to Update Child Components? categories: - practice --- #### props -最简单的也是最常用的父组件更新子组件的方式就是父组件将数据通过**props**传给子组件,当相关的变量被更新的时候,MVVM框架会自动将数据的更新映射到视图上。 +Typically, child components update is done by passing data to child components with **props**, the MVVM framework will do the rest. ```javascript @@ -42,7 +42,8 @@ class Parent extends san.Component { #### ref -更灵活的方式是通过**ref**拿到子组件的实例,通过这个子组件的实例可以手动调用`this.data.set`来更新子组件的数据,或者直接调用子组件声明时定义的成员方法。 + +Actually the reference to the child component can be obtained by the `.ref()` method. Having this reference, we can call `ref.data.set()` or its member methods to update the child component's data. ```javascript class Son extends san.Component { @@ -57,7 +58,7 @@ class Parent extends san.Component { static template = `
- +
`; @@ -75,7 +76,7 @@ class Parent extends san.Component { #### message -除了**ref**外,父组件在接收子组件向上传递的消息的时候,也可以拿到子组件的实例,之后的操作方式就和上面所说的一样了。 +Apart from the `.ref()` method, child component's reference can also be found in the event object which is dispatched from the child. ```javascript class Son extends san.Component { @@ -99,7 +100,7 @@ class Parent extends san.Component { `; - // 声明组件要处理的消息 + // declare the expected message names static messages = { 'son-clicked': function (arg) { let son = arg.target; From 5c73e0c60760e345fa493e2caa8f7794b19b85b6 Mon Sep 17 00:00:00 2001 From: Jun Yang Date: Mon, 19 Nov 2018 11:12:29 +0800 Subject: [PATCH 2/2] Update parent-to-child.md --- source/_posts/en/practice/parent-to-child.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/source/_posts/en/practice/parent-to-child.md b/source/_posts/en/practice/parent-to-child.md index 8cdfef3..4d39a49 100644 --- a/source/_posts/en/practice/parent-to-child.md +++ b/source/_posts/en/practice/parent-to-child.md @@ -6,7 +6,7 @@ categories: #### props -Typically, child components update is done by passing data to child components with **props**, the MVVM framework will do the rest. +Pass parent data to a child component with **props**, the child component will automatically get updated upon data changes. ```javascript