组件的开发和引用
当我们将项目中公用的块,或者页面中多处样式一样,只是数据展示不同的地方抽取出一个个公用组件时,可以提高我们的开发效率,避免重复的工作,只需要在不同的页面引入公用的组件即可。创建一个viewMore.vue文件,定义一个组件块。
<template>
<div class="xx">组件</div>
</template>
<script>
export default {
name: 'viewMore',
components: {},
data() {
return {
}
}
}
</script>
<style scoped>
可以定义组件都有的样式
</style>
这样就可以在其它组件引用了,引用方式很简单:例如在index.vue中引进viewMore.vue组件,假设两个文件处在同级目录中。文章来源:https://www.toymoban.com/news/detail-806952.html
index.vue中的代码:文章来源地址https://www.toymoban.com/news/detail-806952.html
<template>
<more></more>
</template>
<script>
import viewMore from 'viewMore.vue'
export default {
name: 'index',
components: {
more: viewMore
},
data() {
return {
}
}
}
</script>
到了这里,关于组件开发遇到的问题(vue的问题)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!