vue + typeScript 做项目（一）

最新推荐文章于 2024-09-13 22:00:11 发布

小墨宝

最新推荐文章于 2024-09-13 22:00:11 发布

阅读量883

点赞数

分类专栏： vue typeScript

本文链接：https://blog.csdn.net/qq_38935512/article/details/107668046

版权

vue 同时被 2 个专栏收录

14 篇文章 1 订阅

订阅专栏

typeScript

3 篇文章 0 订阅

订阅专栏

一。创建项目，建议用vue-cli3.0 支持会相对比较好
vue create ts
在这里插入图片描述
选择手动

css选择sass 校验选择es

二。文件结构
在这里插入图片描述

打开home.vue ，这里说得是改成class得形式 export default Vue.extend这个改变不大不说了
在这里插入图片描述
需要改子下

<template>
  <div class="home">
    <img alt="Vue logo" src="../assets/logo.png">
    <HelloWorld msg="Welcome to Your Vue.js App"/>
  </div>
</template>

<script lang="ts">
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue';
import { Vue,Component } from 'vue-property-decorator';		// 用它得函数修饰符  后面会详细说这个

@Component({  //就算没组件 也必须得写
  components: {
      HelloWorld,
  },
})
export default class helloWorld extends Vue {
  created() {
   
  }
  // name: 'Home',
  // @components: {
  //   HelloWorld
  // }
}
</script>

下一章，会引入公共得ts, 混入ts 封装axios 看看与原来得区别