# Layout

- category: layout
- chinese: 布局
- type: 布局

---

## 设计思路


Grid 与 Col 配合使用可以用来做栅格布局。由于 Weex 不支持 flex-wrap 属性，当遇到多行多列依次排开的时候，可以使用 MultiRow ，避免过多计算。


## API

### Layout.Grid

  Grid 与 Col 配合使用

  ```js
  <Layout.Grid>
    <Layout.Col><Text>红色</Text></Layout.Col>
    <Layout.Col><Text>白色</Text></Layout.Col>
    <Layout.Col><Text>绿色</Text></Layout.Col>
  </Layout.Grid>
```
### Layout.MultiRow

  | 属性       | 说明         | 类型     | 默认值 |
  | ---------- | ------------ | -------- | ------ |
  | dataSource | 数据源       | array    | 无     |
  | rows       | 列数         | number   | 无     |
  | renderRow  | 单列渲染方法 | function | false  |