Merge remote-tracking branch 'baidu/master'

docs/components/chart.md

@@ -319,16 +319,17 @@ order: 34
 
 ## 属性表
 
-| 属性名             | 类型                              | 默认值    | 说明                                                               |
+| 属性名             | 类型                                 | 默认值    | 说明                                                               |
-| ------------------ | --------------------------------- | --------- | ------------------------------------------------------------------ |
+| ------------------ | ------------------------------------ | --------- | ------------------------------------------------------------------ |
-| type               | `string`                          | `"chart"` | 指定为 chart 渲染器                                                |
+| type               | `string`                             | `"chart"` | 指定为 chart 渲染器                                                |
-| className          | `string`                          |           | 外层 Dom 的类名                                                    |
+| className          | `string`                             |           | 外层 Dom 的类名                                                    |
-| body               | [SchemaNode](../types/schemanode) |           | 内容容器                                                           |
+| body               | [SchemaNode](../types/schemanode)    |           | 内容容器                                                           |
-| api                | [api](../types/api)               |           | 配置项接口地址                                                     |
+| api                | [api](../types/api)                  |           | 配置项接口地址                                                     |
-| initFetch          | `boolean`                         |           | 组件初始化时，是否请求接口                                         |
+| source             | [数据映射](../concepts/data-mapping) |           | 通过数据映射获取数据链中变量值作为配置                             |
-| interval           | `number`                          |           | 刷新时间(最低 3000)                                                |
+| initFetch          | `boolean`                            |           | 组件初始化时，是否请求接口                                         |
-| config             | `object | string`                 |           | 设置 eschars 的配置项,当为`string`的时候可以设置 function 等配置项 |
+| interval           | `number`                             |           | 刷新时间(最低 3000)                                                |
-| style              | `object`                          |           | 设置根元素的 style                                                 |
+| config             | `object` 或 `string`                 |           | 设置 eschars 的配置项,当为`string`的时候可以设置 function 等配置项 |
-| width              | `string`                          |           | 设置根元素的宽度                                                   |
+| style              | `object`                             |           | 设置根元素的 style                                                 |
-| height             | `string`                          |           | 设置根元素的高度                                                   |
+| width              | `string`                             |           | 设置根元素的宽度                                                   |
-| replaceChartOption | `boolean`                         | `false`   | 每次更新是完全覆盖配置项还是追加？                                 |
+| height             | `string`                             |           | 设置根元素的高度                                                   |
+| replaceChartOption | `boolean`                            | `false`   | 每次更新是完全覆盖配置项还是追加？                                 |

docs/components/form/formitem.md

@@ -264,6 +264,32 @@ order: 1
 
 如上例，更改姓名表单项值，可以改变表单数据域中`name`变量的值。
 
+也支持链式配置 `name`属性，例如：`aaa.bbb`
+
+```schema:height="350" scope="body"
+{
+  "type": "form",
+  "debug": true,
+  "controls": [
+    {
+      "type": "text",
+      "label": "姓名",
+      "name": "person.name"
+    }
+  ]
+}
+```
+
+观察上例，这样更改表单项值，会改变数据域中`person.name`的值
+
+```json
+{
+  "person": {
+    "name": "xxx"
+  }
+}
+```
+
 ## 配置默认值
 
 通过配置`value`属性，可以设置表单项的默认值。

docs/start/getting-started.md

@@ -11,68 +11,117 @@ description:
 npm i amis
 ```
 
+### 主题样式
+
+目前支持三种主题：`default（默认主题）`、`cxd（云舍）`和`dark（暗黑）`
+
+1. 引入样式文件：
+
+html 中引入：
+
+```html
+<link href="./node_modules/amis/lib/themes/default.css" />
+<!-- 或 <link href="./node_modules/amis/lib/themes/cxd.css" /> -->
+<!-- 或 <link href="./node_modules/amis/lib/themes/dark.css" /> -->
+```
+
+js 中引入：
+
+```js
+import './node_modules/amis/lib/themes/default.css';
+// 或 import './node_modules/amis/lib/themes/cxd.css';
+// 或 import './node_modules/amis/lib/themes/dark.css';
+```
+
+> 上面只是示例，请根据自己的项目结构调整引用路径
+
+2. 渲染器使用配置主题
+
+```js
+renderAmis(
+  {
+    type: 'page',
+    title: '简单页面',
+    body: '内容'
+  },
+  {},
+  {
+    // env...
+    theme: 'default' // cxd 或 dark
+  }
+);
+```
+
 ### 使用
 
 可以在 React Component 这么使用（TypeScript）。
 
 ```tsx
 import * as React from 'react';
-import {
+import {render as renderAmis} from 'amis';
-    render as renderAmis
-} from 'amis';
 
 class MyComponent extends React.Component<any, any> {
-    render() {
+  render() {
-        return (
+    return (
-            <div>
+      <div>
-                <p>通过 amis 渲染页面</p>
+        <p>通过 amis 渲染页面</p>
-                {renderAmis({
+        {renderAmis(
-                    // schema
+          {
-                    // 这里是 amis 的 Json 配置。
+            // schema
-                    type: 'page',
+            // 这里是 amis 的 Json 配置。
-                    title: '简单页面',
+            type: 'page',
-                    body: '内容'
+            title: '简单页面',
-                }, {
+            body: '内容'
-                    // props
+          },
-                }, {
+          {
-                    // env
+            // props
-                    // 这些是 amis 需要的一些接口实现
+          },
-                    // 可以参考本项目里面的 Demo 部分代码。
+          {
+            // env
+            // 这些是 amis 需要的一些接口实现
+            // 可以参考后面的参数介绍。
 
-                    updateLocation: (location:string/*目标地址*/, replace:boolean/*是replace，还是push？*/) => {
+            updateLocation: (
-                        // 用来更新地址栏
+              location: string /*目标地址*/,
-                    },
+              replace: boolean /*是replace，还是push？*/
+            ) => {
+              // 用来更新地址栏
+            },
 
-                    jumpTo: (location:string/*目标地址*/) => {
+            jumpTo: (location: string /*目标地址*/) => {
-                        // 页面跳转， actionType:  link、url 都会进来。
+              // 页面跳转， actionType:  link、url 都会进来。
-                    },
+            },
 
-                    fetcher: ({
+            fetcher: ({
-                        url,
+              url,
-                        method,
+              method,
-                        data,
+              data,
-                        config
+              config
-                    }:{
+            }: {
-                        url:string/*目标地址*/,
+              url: string /*目标地址*/;
-                        method:'get' | 'post' | 'put' | 'delete'/*发送方式*/,
+              method: 'get' | 'post' | 'put' | 'delete' /*发送方式*/;
-                        data: object | void/*数据*/,
+              data: object | void /*数据*/;
-                        config: object/*其他配置*/
+              config: object /*其他配置*/;
-                    }) => {
+            }) => {
-                        // 用来发送 Ajax 请求，建议使用 axios
+              // 用来发送 Ajax 请求，建议使用 axios
-                    },
+            },
-                    notify: (type:'error'|'success'/**/, msg:string/*提示内容*/) => {
+            notify: (
-                        // 用来提示用户
+              type: 'error' | 'success' /**/,
-                    },
+              msg: string /*提示内容*/
-                    alert: (content:string/*提示信息*/) => {
+            ) => {
-                        // 另外一种提示，可以直接用系统框
+              // 用来提示用户
-                    },
+            },
-                    confirm: (content:string/*提示信息*/) => {
+            alert: (content: string /*提示信息*/) => {
-                        // 确认框。
+              // 另外一种提示，可以直接用系统框
-                    }
+            },
-                });}
+            confirm: (content: string /*提示信息*/) => {
-            </div>
+              // 确认框。
-        );
+            }
-    }
+          }
+        )}
+      </div>
+    );
+  }
 }
 ```
 
@@ -80,7 +129,7 @@ class MyComponent extends React.Component<any, any> {
 
 参数说明：
 
-- `schema` 即页面配置，请前往[基本用法](./basic.md)了解.
+- `schema` 即页面配置，请前往 [配置与组件](../concepts/schema) 了解.
 - `props` 一般都用不上，如果你想传递一些数据给渲染器内部使用，可以传递 data 数据进去。如：
 
   ```jsx

src/renderers/Carousel.tsx

@@ -47,7 +47,7 @@ const defaultSchema = {
   type: 'tpl',
   tpl: `
     <% if (data.hasOwnProperty('image')) { %>
-        <div style="background-image: url(<%= data.image %>); background-size: contain; background-repeat: no-repeat; background-position: center center;" class="image <%= data.imageClassName %>"></div>
+        <div style="background-image: url('<%= data.image %>'); background-size: contain; background-repeat: no-repeat; background-position: center center;" class="image <%= data.imageClassName %>"></div>
         <% if (data.hasOwnProperty('title')) { %>
             <div class="title <%= data.titleClassName %>"><%= data.title %></div>
         <% } if (data.hasOwnProperty('description')) { %> 
@@ -56,7 +56,7 @@ const defaultSchema = {
     <% } else if (data.hasOwnProperty('html')) { %>
         <%= data.html %>"
     <% } else if (data.hasOwnProperty('image')) { %>
-        <div style="background-image: url(<%= data.image %>)" class="image <%= data.imageClassName %>"></div>
+        <div style="background-image: url('<%= data.image %>')" class="image <%= data.imageClassName %>"></div>
         <% if (data.title) { %>
             <div class="title <%= data.titleClassName %>"><%= data.title %></div>
         <% } if (data.description) { %>