有时候,我们使用渲染函数(render function
)来抽象组件,而渲染函数有时候写起来是非常痛苦的,这个时候就派 JSX
上场了。在 Vue
中使用 JSX
,需要使用 Babel
插件,它可以让我们回到更接近于模板的语法
npm install @vue/babel-preset-jsx @vue/babel-helper-vue-jsx-merge-props
然后进行配置.babelrc
:
= {
presets: [
'@vue/cli-plugin-babel/preset',
['@vue/babel-preset-jsx',
{
'injectH': false
}]
]
}
随后就可以在vue中使用JSX语法!