vue3使用动态组件component；vue2使用动态组件components

注意：vue3使用component标签 vue2使用components标签；
一个带s 一个不带s

一、vue3使用

<component :is="componentName[item.formType]" v-model="searchData[item.field]"   :list="item.selectList" :type="item.formType" :format="item.dateType"></component>



import { ref, shallowRef } from 'vue'

import InputFilter from "./components/input.vue";
import SelectFilter from "./components/select.vue";

// 注意组件使用shallowRef包裹
const componentName = ref({
  input: shallowRef(InputFilter),
  select: shallowRef(SelectFilter),
})

二、veu2使用

<components :is="componentName[item.formType]" v-model="searchData[item.field]"   :list="item.selectList" :type="item.formType" :format="item.dateType"></components>





import InputFilter from "./components/input.vue";
import SelectFilter from "./components/select.vue";


data(){
	return {
		componentName: {
		  input: InputFilter,
		  select: SelectFilter,
		}

	}
}