Vue 中的jsx写法探究

平时我们习惯了写模板的方式来写vue组件,但是有时候这样会很浪费代码量,于是我们可以改用jsx写法,例如

我们要封装这样一个组件,最原始的方式我们是不是要写很多个v-if来进行判断,但是这不是我们想要的

 这是h1
 这是h2

jsx里面的正文是

export default {
  props: {
    level: {
      type: Number,
      required: true
    }
  },
  render(createElement) {
    let t = 'h' + this.level
    return {this.$slots.default}
  }
}

这样我们就可以很方便的进行组件封装了!

你可能感兴趣的:(vuejs,vue,封装)