mirror of
https://github.com/tusen-ai/naive-ui.git
synced 2025-01-06 12:17:13 +08:00
07akioni
GitHub
commit
3505549c32
@ -1,5 +1,13 @@
|
||||
# Common Issues
|
||||
|
||||
Currently there is no content.
|
||||
## 1. The difference between @update:xxx and on-update:xxx
|
||||
|
||||
There is no difference between `@update:xxx` and `on-update:xxx` when used in templates.
|
||||
|
||||
In Naive UI, all API documents use the `on-update:xxx` format, because `@` is just a shorthand provided by Vue.
|
||||
|
||||
If you prefer camelCase, you can use `onUpdate:xxx`.
|
||||
|
||||
If you are using JSX, you can use `onUpdateXxx` (all `onUpdate:xxx` have an equivalent implementation of `onUpdateXxx`).
|
||||
|
||||
If you have any problem, feel free to create a PR or issue on GitHub.
|
||||
|
||||
@ -1,5 +1,13 @@
|
||||
# 常见问题
|
||||
|
||||
暂时还没有内容。
|
||||
## 1. @update:xxx 和 on-update:xxx 的区别
|
||||
|
||||
`@update:xxx` 和 `on-update:xxx` 在模版中使用时没有任何区别。
|
||||
|
||||
在 Naive UI 中，全部的 API 文档使用 `on-update:xxx` 格式，因为 `@` 只是 Vue 提供的一种简写。
|
||||
|
||||
如果你偏爱 camelCase，可以使用 `onUpdate:xxx`。
|
||||
|
||||
如果你在使用 JSX，可以使用 `onUpdateXxx`（所有的 `onUpdate:xxx` 都有一个 `onUpdateXxx` 的对等实现）。
|
||||
|
||||
如果你发现任何问题，欢迎在 GitHub 上提交 issue 和 PR。
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
# Basic
|
||||
# 基础用法
|
||||
|
||||
```html
|
||||
<n-carousel>
|
||||
|
||||
@ -47,7 +47,7 @@ tree
|
||||
| checked-row-keys | `Array<string \| number>` | `undefined` | The keys of checked rows. |
|
||||
| cascade | `boolean` | `true` | Whether to do cascade checking when using tree data. |
|
||||
| children-key | `string` | `'children'` | The key of children data in tree data's data entity. |
|
||||
| columns | `Array<Column>` | `[]` | Columns to display. |
|
||||
| columns | `Array<DataTableColumn>` | `[]` | Columns to display. |
|
||||
| data | `Array<object>` | `[]` | Data to display. |
|
||||
| default-checked-row-keys | `Array<string \| number>` | `[]` | The key value selected by default. |
|
||||
| indent | `number` | `16` | Indent of row content when using tree data. |
|
||||
@ -67,7 +67,7 @@ tree
|
||||
| table-layout | `'auto' \| 'fixed'` | `'auto'` | Style `table-layout` of the table. When `ellpisis` or `max-height` are set, it will always be `'fixed'` regardless of what you set. |
|
||||
| virtual-scroll | `boolean` | `false` | Whether to use virtual scroll to deal with large data. Make sure `max-height` is set before using it. |
|
||||
| on-update:checked-row-keys | `(keys: Array<string \| number>) => void` | `undefined` | The callback function triggered when the checked-row-keys value changes. |
|
||||
| on-update:filters | `(filters: { [string \| number]: Array<string \| number> \| string \| number }, initiatorColumn: Column)` | `undefined` |The callback function triggered when the filters data changes. |
|
||||
| on-update:filters | `(filters: { [string \| number]: Array<string \| number> \| string \| number }, initiatorColumn: DataTableColumn)` | `undefined` | The callback function triggered when the filters data changes. |
|
||||
| on-update:page | `(page: number)` | `undefined` | Callback function triggered when the page changes. |
|
||||
| on-update:page-size | `(pageSize: number) => void` | `undefined` | Callback function triggered when the page-size changes. |
|
||||
| on-update:sorter | `(options: { columnKey: string \| number, sorter: 'default' \| function \| boolean, order: 'ascend' \| 'descend' \| false } \| null) => void` | `undefined` | If there won't be a active sorter after change, `options` will be `null`. |
|
||||
@ -94,12 +94,12 @@ These methods can help you control table in an uncontrolled manner. However, it'
|
||||
|
||||
## API
|
||||
|
||||
### Column Properties
|
||||
### DataTableColumn Properties
|
||||
|
||||
| Name | Type | Default | Description |
|
||||
| --- | --- | --- | --- |
|
||||
| align | `'left' \| 'right' \| 'center'` | `'left'` | Text align in column. |
|
||||
| children | `Column[]` | `undefined` | Child nodes of a grouped column. |
|
||||
| children | `DataTableColumn[]` | `undefined` | Child nodes of a grouped column. |
|
||||
| className | `string` | `undefined` | Class name of the column. |
|
||||
| colSpan | `(rowData: object, rowIndex: number) => number` | `undefined` | The col span of the column cell. |
|
||||
| defaultFilterOptionValue | `string \| number \| null` | `null` | The default active filter option value in uncontrolled manner. (works when not using multiple filters). |
|
||||
|
||||
@ -47,7 +47,7 @@ tree
|
||||
| checked-row-keys | `Array<string \| number>` | `undefined` | 被选中的列的 key |
|
||||
| cascade | `boolean` | `true` | 在进行树型数据选择的时候是否级联 |
|
||||
| children-key | `string` | `'children'` | 树形数据下后代节点在数据中的 key |
|
||||
| columns | `Array<Column>` | `[]` | 需要展示的列 |
|
||||
| columns | `Array<DataTableColumn>` | `[]` | 需要展示的列 |
|
||||
| data | `Array<object>` | `[]` | 需要展示的数据 |
|
||||
| default-checked-row-keys | `Array<string \| number>` | `[]` | 默认选中的 key 值 |
|
||||
| indent | `number` | `16` | 使用树形数据时行内容的缩进 |
|
||||
@ -61,13 +61,13 @@ tree
|
||||
| row-props | `(rowData: object, rowIndex : number) => object` | `undefined` | 自定义行属性 |
|
||||
| scroll-x | `number \| string` | `undefined` | 表格内容的横向宽度，如果列被水平固定了，则需要设定它 |
|
||||
| single-column | `boolean` | `false` | 是否展示为一列（true 时每一列都有 border-bottom） |
|
||||
| single-line | `boolean` | `true` | 是否展示为一行（true 时每一行都有 border-bottom）|
|
||||
| single-line | `boolean` | `true` | 是否展示为一行（true 时每一行都有 border-bottom） |
|
||||
| size | `'small' \| 'medium' \| 'large'` | `'medium'` | 表格的尺寸 |
|
||||
| summary | `CreateSummary` | `undefined` | 表格总结栏的数据，类型见 <n-a href="#CreateSummary-Type">CreateSummary Type</n-a> |
|
||||
| table-layout | `'auto' \| 'fixed'` | `'auto'` | 表格的 `table-layout` 样式属性，在设定 `ellpisis` 或 `max-height` 的情况下固定为 `'fixed'` |
|
||||
| virtual-scroll | `boolean` | `false` | 是否开启虚拟滚动，应对大规模数据，开启前请设定好 `max-height` |
|
||||
| on-update:checked-row-keys | `(keys: Array<string \| number>) => void` | `undefined` | checked-row-keys 值改变时触发的回调函数 |
|
||||
| on-update:filters | `(filters: { [string \| number]: Array<string \| number> \| string \| number }, initiatorColumn: Column)` | `undefined` | filters 数据改变时触发的回调函数 |
|
||||
| on-update:filters | `(filters: { [string \| number]: Array<string \| number> \| string \| number }, initiatorColumn: DataTableColumn)` | `undefined` | filters 数据改变时触发的回调函数 |
|
||||
| on-update:page | `(page: number)` | `undefined` | page 改变时触发的回调函数 |
|
||||
| on-update:page-size | `(pageSize: number) => void` | `undefined` | page-size 改变时触发的回调函数 |
|
||||
| on-update:sorter | `(options: { columnKey: string \| number, sorter: 'default' \| function \| boolean, order: 'ascend' \| 'descend' \| false } \| null) => void` | `undefined` | 如果在变动后没有激活的排序，那么 `options` 为 `null` |
|
||||
@ -94,12 +94,12 @@ tree
|
||||
|
||||
## API
|
||||
|
||||
### Column Properties
|
||||
### DataTableColumn Properties
|
||||
|
||||
| 名称 | 类型 | 默认值 | 说明 |
|
||||
| --- | --- | --- | --- |
|
||||
| align | `'left' \| 'right' \| 'center'` | `'left'` | 列内的文本排列 |
|
||||
| children | `Column[]` | `undefined` | 成组列头的子节点 |
|
||||
| children | `DataTableColumn[]` | `undefined` | 成组列头的子节点 |
|
||||
| className | `string` | `undefined` | 列的类名 |
|
||||
| colSpan | `(rowData: object, rowIndex: number) => number` | `undefined` | 该列单元格的的 col span |
|
||||
| defaultFilterOptionValue | `string \| number \| null` | `null` | 非受控状态下默认的过滤器选项值（过滤器单选时生效） |
|
||||
|
||||
@ -21,32 +21,32 @@ size
|
||||
|
||||
| Name | Type | Default | Description |
|
||||
| --- | --- | --- | --- |
|
||||
| bordered | `boolean` | `false` | |
|
||||
| column | `number` | `3` | |
|
||||
| label-align | `'center' \| 'left' \| 'right'` | `'left'` | |
|
||||
| label-placement | `'top' \| 'left'` | `'top'` | |
|
||||
| size | `'small' \| 'medium' \| 'large'` | `'medium'` | |
|
||||
| title | `string` | `undefined` | |
|
||||
| bordered | `boolean` | `false` | Whether to display border. |
|
||||
| column | `number` | `3` | Total columns. |
|
||||
| label-align | `'center' \| 'left' \| 'right'` | `'left'` | Label align. |
|
||||
| label-placement | `'top' \| 'left'` | `'top'` | Label placement. |
|
||||
| size | `'small' \| 'medium' \| 'large'` | `'medium'` | Size of the description. |
|
||||
| title | `string` | `undefined` | Title of the description. |
|
||||
|
||||
### Description Item Props
|
||||
|
||||
| Name | Type | Default | Description |
|
||||
| ----- | -------- | ----------- | ----------- |
|
||||
| label | `string` | `undefined` | |
|
||||
| span | `number` | `1` | |
|
||||
| Name | Type | Default | Description |
|
||||
| ----- | -------- | ----------- | ------------------------ |
|
||||
| label | `string` | `undefined` | Label of the item. |
|
||||
| span | `number` | `1` | Column span of the item. |
|
||||
|
||||
## Slots
|
||||
|
||||
### Descriptions Slots
|
||||
|
||||
| Name | Parameters | Description |
|
||||
| ------- | ---------- | ----------- |
|
||||
| default | `()` | |
|
||||
| header | `()` | |
|
||||
| Name | Parameters | Description |
|
||||
| ------- | ---------- | --------------- |
|
||||
| default | `()` | Content. |
|
||||
| header | `()` | Header content. |
|
||||
|
||||
### Description Item Slots
|
||||
|
||||
| Name | Parameters | Description |
|
||||
| ------- | ---------- | ----------- |
|
||||
| default | `()` | |
|
||||
| label | `()` | |
|
||||
| Name | Parameters | Description |
|
||||
| ------- | ---------- | ------------- |
|
||||
| default | `()` | Item content. |
|
||||
| label | `()` | Item label. |
|
||||
|
||||
@ -19,34 +19,34 @@ size
|
||||
|
||||
### Descriptions Props
|
||||
|
||||
| 名称 | 类型 | 默认值 | 说明 |
|
||||
| --------------- | -------------------------------- | ----------- | ---- |
|
||||
| bordered | `boolean` | `false` | |
|
||||
| column | `number` | `3` | |
|
||||
| label-align | `'center' \| 'left' \| 'right'` | `'left'` | |
|
||||
| label-placement | `'top' \| 'left'` | `'top'` | |
|
||||
| size | `'small' \| 'medium' \| 'large'` | `'medium'` | |
|
||||
| title | `string` | `undefined` | |
|
||||
| 名称 | 类型 | 默认值 | 说明 |
|
||||
| --- | --- | --- | --- |
|
||||
| bordered | `boolean` | `false` | 是否显示 border |
|
||||
| column | `number` | `3` | 设置的总列数 |
|
||||
| label-align | `'center' \| 'left' \| 'right'` | `'left'` | label 对齐方式 |
|
||||
| label-placement | `'top' \| 'left'` | `'top'` | label 显示位置 |
|
||||
| size | `'small' \| 'medium' \| 'large'` | `'medium'` | 尺寸 |
|
||||
| title | `string` | `undefined` | 标题 |
|
||||
|
||||
### Description Item Props
|
||||
|
||||
| 名称 | 类型 | 默认值 | 说明 |
|
||||
| ----- | -------- | ----------- | ---- |
|
||||
| label | `string` | `undefined` | |
|
||||
| span | `number` | `1` | |
|
||||
| 名称 | 类型 | 默认值 | 说明 |
|
||||
| ----- | -------- | ----------- | --------------- |
|
||||
| label | `string` | `undefined` | 显示的 label 值 |
|
||||
| span | `number` | `1` | 所占的单元格数 |
|
||||
|
||||
## Slots
|
||||
|
||||
### Descriptions Slots
|
||||
|
||||
| 名称 | 参数 | 说明 |
|
||||
| ------- | ---- | ---- |
|
||||
| default | `()` | |
|
||||
| header | `()` | |
|
||||
| 名称 | 参数 | 说明 |
|
||||
| ------- | ---- | ----------- |
|
||||
| default | `()` | 描述的内容 |
|
||||
| header | `()` | header 内容 |
|
||||
|
||||
### Description Item Slots
|
||||
|
||||
| 名称 | 参数 | 说明 |
|
||||
| ------- | ---- | ---- |
|
||||
| default | `()` | |
|
||||
| label | `()` | |
|
||||
| 名称 | 参数 | 说明 |
|
||||
| ------- | ---- | ------------------- |
|
||||
| default | `()` | 描述项的内容 |
|
||||
| label | `()` | 描述项的 label 信息 |
|
||||
|
||||
Loading…
Reference in New Issue
Block a user