这段内容应该放在前一篇的,失误了~~
setup语法糖
改一下Car.vue:
车牌号:{{ vehicleNo }}
VIN:{{ vin }}
车龄:{{ vehicleAge }}
<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>
本文暂时没有评论,来添加一个吧(●'◡'●)