vue中 ：is的用法

按照下图创建目录结构 components 里面是组件 注册组件并引入

<template>
  <view>
	<view class="the-home">
			<div @click="getCom">点击</div>
			<!-- 组件的动态切换 -->
			<component :is="component"></component>
	</view>
  </view>
</template>
	
<script>
	import Editor from './components/editor/editor.vue'
	import My from './components/my/my.vue'
	import Index from './components/index/index.vue'
	import User from './components/user/user.vue'
export default {
  components: {
	  Editor,
	  My,
	  Index,
	  User
  },
  data () {
    return {
		num: 0,
	}
  },
  computed: {
	  component: function() {
		  switch(this.num) {
			  case 0:
			  return 'Editor'
			  case 1:
			  return 'My'
			  case 2:
			  return 'Index'
			  case 3:
			  return 'User'
		  }
	  }
  },
  methods: {
	  getCom() {
		  this.num++
	  },
  }
}
</script>

<style lang="scss" scoped>

</style>