TpyeScript+VUE3.x學習之路01 建立專案

需要安裝node
全域性安裝腳手架npm install -g @vue/cli
或者ui安裝 vue ui
建立專案 vue create vue3TS

1，基本結構

export default {
  name: 'HelloWorld',
  setup(){//所有內容都將寫在setup裡面
    const refUl = ref();//ref(0)//重要屬性ref
    const data = reactive({
      listName: ["張無忌","張三丰","喬峰"],
      selectName: "",
      selectFun: (index: number) => {
        data.selectName = data.listName[index];
      },
    })
    onMounted(() => {//生命週期
      console.log(refUl.value.children)
      
    })
    //使用toRefs可以將資料都寫在reactive裡面 一起返回
    const refData = toRefs(data);
    return {
      ...refData,
      refUl
    }
    //要做響應式需要把資料return出去
  }
};