vue-carbon这个怎么用?

我跟着这个教程走

clipboard.png

但是

clipboard.png

我的操作具体是:

npm install vue-carbon --save

然后把下面的加入到main.js中
//import Vue from 'vue' 因为这个好像生成的那里有了就没有加进去
import VueCarbon from 'vue-carbon'
Vue.use(VueCarbon)

然后在HelloWorld.vue里面放上去他的实例:

<template>
<div class="page">
<header-bar>

<icon-button slot="left" @click="back()" icon="arrow_back"></icon-button>
<span>Refresh Control</span>
<icon-button slot="right" @click="refresh()" icon="refresh"></icon-button>

</header-bar>
<content v-el:trigger>

<refresh-control @refresh="refresh" :trigger="$els.trigger" :refreshing="refreshing"></refresh-control>
<content-block>
  <p class="refresh-desc">
     按住 - 下拉 - 释放可以刷新数据
  </p>
</content-block>
<list>
  <item-cell v-for="item in items">
    <item-title>
      {{item}}
    </item-title>
  </item-cell>
</list>

</content>
</div>
</template><script>export default { data () { return { items: ['1', '2', '3', '5', '6', '7', '8', '9', '10'], end: 10, refreshing: false } }, methods: { back () { window.history.back() }, refresh () { this.refreshing = true setTimeout(() => { this.refreshing = false var arr = [] for (let i = this.end; i < this.end + 10; i++) { arr.push(String(i + 1)) } this.end += 10 this.items = arr }, 2000) } }}</script><style lang="less">.refresh-desc{ text-align: center;}</style>

然后我实例还没放上去就已经出现

clipboard.png

阅读 3.1k
1 个回答

报错是指你使用了html内置的buttonswitch作为组件。刚开始简单引入一个组件即可,便于排查问题所在。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题