vue封装组件(一)标签和下拉框组合实现添加数据

背景: 最近接入短剧内容，需要添加短剧合作方。在详情页需要支持添加组件 方案一：标签tag加上输入框实现添加数据。图片见下 这个是刚开始做的，后来产品觉得这样会造成随意修改数据，需要改成下拉框形式添加 方案二：标签tag加上下拉框以及添加按钮实现。 这个就避免了乱添加数据，添加合作方名字需要在一个管理页面添加，然后下拉框请求自然就请求到数据了

方案一效果图：第一行 流程：点击新增后，填入数据，后台会自动检查是否存在，存在返回数据，否则保存然后返回数据。 这样做有个问题，一不小心填错数据，后台也保存下来了 方案二效果图：第二行 流程：下拉框中是已经存在的数据，然后选择添加就行。合作方需要在另外的一个管理页面增删查改。

接下来是代码实现。 注意：这两个都是封装的组件，直接掉用即可，既然是封装的组件，那么就要支持已经存在的合作方数据填入。

方案一

这个就是封装的组件，然后想用的时候直接引用即可。

方案二

最终就是外面的调用

ok，本期结束，关注作者不迷路～持续更新好用的组件～