记一次高版本view-design的组件迁移到自身项目的低版本

背景

npm i -S view-design

当前老项目使用view-design这个组件库，但是当我们去官网查看该组件库最新版本，竟然发现没有博主想用的image/ImagePreivew这两个基础组件

说实话，有点离谱了哈！！

自己造轮子？

貌似为了一天的小需求，不太可能，直接找view-design的弟弟view-ui-plus它的这两个基础组件，然后整合进去

进入主题

1. 先给大家介绍一个vs-code的插件，这样大家操作起来会简单点（好有爱的博主！！）
2. 

然后利用这个插件，把viewuiplus的源码打开，找到这image/ImagePreivew两个组件的代码，
接下来我会说一下，我们需要更改的部分

1. 当你把源码放到项目，那么你项目中就会多出这两个组件的文件夹，就想这样

由于view-design是基于vue2.x版本封装的组件，而view-ui-plus是基于vue3.x写的。拷贝之后，代码中会出现很多新的api和组件使用，我们要一一替换成vue2.x版本的写法。

替换写法【要先初步看看这两个组件的代码哈】

.vue文件
文件中出现的getCurrentInstance()的api，是vue3组合api中用来获取vue实例的，所以我们在vue2中，直接this就可以, 用代码表述意思就是

// vue3
import {
    getCurrentInstance } from 'vue';

// 获取组件实例
const global = getCurrentInstance().appContext.config.globalProperties;

// vue2
this

但是，这里直接采用固定的默认值就行，举个栗子【其他的同理改】

transfer: {
   
    type: Boolean