• 如何在 Nuxt.js 中使用 JSX?

    如何在 Nuxt.js 中使用 JSX?

    Nuxt.js 使用 Vue.js 官方的 babel-preset-vue-app 做 babel 的默认配置。

    你可以在组件的 render 方法中直接使用 JSX 而不需要做额外的配置:

    1. <script>
    2. export default {
    3. data () {
    4. return { name: 'World' }
    5. },
    6. render (h) {
    7. return <h1 class="red">{this.name}</h1>
    8. }
    9. }
    10. </script>

    这里的 hcreateElement 的简化别名,你会在Vue生态系统中看到它,但它实际上是JSX的可选项,因为它会在ES2015+语法声明的任何方法和getter(不是函数或箭头函数) 中自动注入const h = this.$createElement ,所以你可以删除(h)参数。

    更多关于 JSX 的使用信息,请移步 Vue.js 官方文档的 JSX 章节