编程开源技术交流,分享技术与知识

网站首页 > 开源技术 正文

Vue3开发极简入门(1.1):初始化-补完

wxchong 2025-03-19 17:35:22 开源技术 3 ℃ 0 评论

这段内容应该放在前一篇的,失误了~~

setup语法糖

改一下Car.vue:


<script lang="ts" setup name="Car">
//导入ref
import { ref } from 'vue'
//响应式数据
let vehicleAge = ref(1)
//非响应式数据
let vehicleNo = '车A12345';
let vin = 'vin123456';
function changeVehicleAge() {
    // ref声明的响应式数据,操作时必须加".value"
    vehicleAge.value = vehicleAge.value + 1
    console.log('车龄:', vehicleAge);
}
</script>
  • script标签里面的 setup,是setup方法的语法糖,此方法的在vue的地位、作用、真正的写法,大家可以自己看官方文档,本文不再赘述。
  • script标签里面的 name="XXX",就是给本组件命名的语法糖。

App.vue的写法修改为:


<script lang="ts" setup name="App">
import Car from './components/Car.vue';
</script>

Tags:

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表