naive-ui/demo/pages/docs/jsx/enUS/index.md

31 lines
789 B
Markdown
Raw Normal View History

2021-03-18 15:51:25 +08:00
<!--anchor:on-->
# JSX & TSX
## Enable JSX & TSX
About how to enable JSX & TSX please look at your toolchain's docs.
## Use Component
We recommend importing component directly when using JSX.
```js
import { defineComponent } from 'vue'
import { NButton } from 'naive-ui'
export default defineComponent({
render () {
return <NButton>{{ default: () => 'Star Kirby' }}</NButton>
}
})
```
## Props look like @update:\*
2021-03-18 15:51:25 +08:00
In naive-ui, all props look like `on-update:*` has a corresponding `onUpdate*` prop (since in JSX `on-update:*` and `onUpdate:*` are not valid prop names).
2021-03-18 15:51:25 +08:00
If you find it doesn't exist, I must forget to make it. Please create an issue or PR.
For example, `<n-select @update:value="..." />` in template can be written in `<NSelect onUpdateValue={...} />`.