docs(reactive): update translated docs

alibaba · Jul 25, 2021 · a403cd3 · a403cd3
1 parent 6b839fa
commit a403cd3
Show file tree

Hide file tree

Showing 3 changed files with 59 additions and 13 deletions.
diff --git a/packages/reactive/.umirc.js b/packages/reactive/.umirc.js
@@ -246,7 +246,7 @@ export default {
         children: [
           {
             title: 'observer',
-            path: '/api/react/observer',
+            path: '/zh-CN/api/react/observer',
           },
         ],
       },
@@ -255,7 +255,7 @@ export default {
         children: [
           {
             title: 'observer',
-            path: '/api/vue/observer',
+            path: '/zh-CN/api/vue/observer',
           },
         ],
       },

diff --git a/packages/reactive/docs/api/vue/observer.md b/packages/reactive/docs/api/vue/observer.md
@@ -1,26 +1,26 @@
 # observer
 
-## 描述
+## describe
 
-在 Vue 中，将组件渲染方法变成 Reaction，每次视图重新渲染就会收集依赖，依赖更新会自动重渲染。
+In Vue, the component rendering method is changed to Reaction, and dependencies are collected every time the view is re-rendered, and dependencies are updated automatically to re-render.
 
-## 用例
+## Example
 
 ```html
 <template>
   <div>
     <div>
       <input
         :style="{
-          height: 28,
-          padding: '0 8px',
-          border: '2px solid #888',
-          borderRadius: 3,
-        }"
+           height: 28,
+           padding: '0 8px',
+           border: '2px solid #888',
+           borderRadius: 3,
+         }"
         :value="obs.value"
         @input="(e) => {
-          obs.value = e.target.value
-        }"
+           obs.value = e.target.value
+         }"
       />
     </div>
     <div>{{obs.value}}</div>
@@ -33,7 +33,7 @@
 
   export default observer({
     data() {
-      // 能与 vue 的响应系统共存
+      // can coexist with vue's response system
       const obs = observable({
         value: 'Hello world',
       })

diff --git a/packages/reactive/docs/api/vue/observer.zh-CN.md b/packages/reactive/docs/api/vue/observer.zh-CN.md
@@ -0,0 +1,46 @@
+# observer
+
+## 描述
+
+在 Vue 中，将组件渲染方法变成 Reaction，每次视图重新渲染就会收集依赖，依赖更新会自动重渲染。
+
+## 用例
+
+```html
+<template>
+  <div>
+    <div>
+      <input
+        :style="{
+          height: 28,
+          padding: '0 8px',
+          border: '2px solid #888',
+          borderRadius: 3,
+        }"
+        :value="obs.value"
+        @input="(e) => {
+          obs.value = e.target.value
+        }"
+      />
+    </div>
+    <div>{{obs.value}}</div>
+  </div>
+</template>
+
+<script>
+  import { observable } from '@formily/reactive'
+  import { observer } from '@formily/reactive-vue'
+
+  export default observer({
+    data() {
+      // 能与 vue 的响应系统共存
+      const obs = observable({
+        value: 'Hello world',
+      })
+      return {
+        obs,
+      }
+    },
+  })
+</script>
+```