今天在使用vue内置API自定义全局组件时,

Vue.component('button-counter', {
  data: function () {
    return {
      count: 0
    }
  },
  template: '<button v-on:click="count++">You clicked me {{ count }} times.</button>'
})

结果报错:找了很久,才发现是vue默认是compiler模式,自定义组件需要使用runtime模式,所以出现以下bug

 解决方案:

找到项目中 vue.config.js文件,添加一句  runtimeCompiler: true

const { defineConfig } = require('@vue/cli-service')

module.exports = defineConfig({
  transpileDependencies: true,
  runtimeCompiler: true
})

重启项目,就没有报错了哦!

Logo

鸿蒙生态一站式服务平台。

更多推荐