初涉vue3.0，下面是我在demo中遇到的一些问题(我是用的vue-cli进行开发)
【1】main.js中配置
第一个变化
vue2.x === Vue.prototype.$baseURL= "https://www.xxxxxx.online/mxs/"
vue3.0 === const app = createApp(App); app.config.globalProperties.$baseURL= "https://www.xxxxxx.online/mxs/"
vue3.0中main.js里面已经没有Vue，取代用的是createApp(App);
【2】this的问题
vue2.x === 可以在生命周期中通过this来获取当前实例；
vue3.x === 已经没有this指向;
首先引入 import { getCurrentInstance } from "vue";
再在setup 中 const { proxy } = getCurrentInstance(); 这里proxy就可以得到几乎等同于this的作用
//补充说明：有的文章说用 const { ctx } = getCurrentInstance();但是这样打包后会报错，用proxy就可以完美避免
【3】数据声明的变化
import { ref } from "vue";
setup() {
let str1 = "str1"; //如果只是在setup内部调用，不在页面渲染的数据可以直接生命；
let str2 = ref(str1) //需要在页面渲染的数据用ref包裹，这样才能在后期修改变量值时，页面同步绚烂
str2.value = "我改变了！" //变量值被ref包裹时，想要修改得通过 变量名.value来修改否则会报错
return {
str2
}
}
【4】this.$emit的改变
vue2.x === 子组件 this.$emit("handleFun",data);
vue3.x === setup(props,context) {
context.emit("handleFun",data); //vue3.0 setup自带两个参数props,context可以直接使用注意这里emit没有$符号
父组件中还是同样的方式操作
}
【5】props的用法
vue2.x === props:["attr1","attr2"];
vue3.x ===
html部分
<div v-for(item,index) in attr2 :key="index" :style="{ 'color' : attr1 }" >
script部分
import { toRefs } from "vue";
props:{
attr1:String,
attr2:Object
},
setup(props) {
const { attr1 , attr2 } = toRefs(props); //需要在setup读取props中属性值时使用，如果直接在html使用同vue2.x中一样直接使用即可
const iNeed1 = attr1.value; //使用时得用 .value 来读取属性值
const iNeed2 = attr2.value
return{
props //记得此处不return props ，html中将接受不到props属性
}
}
//入住博客第一篇文章，如果觉得有帮助请帮忙点个赞什么的，如果觉得不好请谅解，培训出来的小菜比，全靠自己摸索====难受，有什么问题也可以跟我留言，如果我有过类似经历会更新博客回答你的问题
