vue3注意事项

1、ref响应式数据的改动需要通过 .value赋值

reactive定义的数据 数组则只能通过使用数组的方法来更替。

2、vue3不再支持filter数据过滤,但更接近react,所以可以使用

复制代码
//c.count需要过滤的数据
<text class="trolley-count">{{trolleyCount(c.count)}}</text>

const trolleyCount = (_count:number) =>{
	if(_count === 0){
		return 0
	}else if(_count<100){
		return _count
	}else{
		return '99+'
	}
}

3、vue3不适合使用this,所以refs也没办法this.$refs,但是可以使用ref(vue3非vue2的)创建一个NULL的绑定数据

复制代码
<div ref="popup"></div>


const popup = ref(null);

4、props接收参数的方式也改为了defineProps

复制代码
import { defineProps} from 'vue'
	const props = defineProps({
		id:{
			type:String,
			default: '0'
		}
	})
相关推荐
贵沫末1 分钟前
React——基础
前端·react.js·前端框架
aklry12 分钟前
uniapp三步完成一维码的生成
前端·vue.js
Rubin9320 分钟前
判断元素在可视区域?用于滚动加载,数据埋点等
前端
爱学习的茄子20 分钟前
AI驱动的单词学习应用:从图片识别到语音合成的完整实现
前端·深度学习·react.js
用户38022585982421 分钟前
使用three.js实现3D地球
前端·three.js
程序无bug23 分钟前
Spring 面向切面编程AOP 详细讲解
java·前端
zhanshuo23 分钟前
鸿蒙UI开发全解:JS与Java双引擎实战指南
前端·javascript·harmonyos
JohnYan23 分钟前
模板+数据的文档生成技术方案设计和实现
javascript·后端·架构
撰卢1 小时前
如何提高网站加载速度速度
前端·javascript·css·html
10年前端老司机1 小时前
在React项目中如何封装一个可扩展,复用性强的组件
前端·javascript·react.js