naive-ui/demo/pages/docs/jsx/enUS/index.md
XieZongChen 81f4d2c070
docs: Fix document errors in jsx (#19)
* docs: Fix document errors for jsx

* Update demo/pages/docs/jsx/enUS/index.md

* Update demo/pages/docs/jsx/zhCN/index.md

* docs: Optimization and modification scheme

Co-authored-by: 谢宗辰 <xiezongchen@xiezongchendeMacBook-Pro.local>
Co-authored-by: 07akioni <07akioni2@gmail.com>
2021-06-08 15:53:04 +08:00

789 B

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.

import { defineComponent } from 'vue'
import { NButton } from 'naive-ui'

export default defineComponent({
  render () {
    return <NButton>{{ default: () => 'Star Kirby' }}</NButton>
  }
})

Props look like @update:*

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).

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={...} />.