vue学习第一天创建项目和steup用法

1.vue-cli创建脚手架工程

如果之前安装过vue2的,需要把2.0相关的卸载掉

npm uninstall vue-cll -g

安装最新脚手架

npm install -g @vue/cli ------- cnpm安装 npm install -g cnpm --registry=https://registry.npm.taobao.org cnpm安装vue-cli脚手架 cnpm install -g @vue/cli

安装成功查看脚手架版本

vue -V

开始构建项目

vue create '项目名' 回车创建 vue create vue-element-plus // 比如这样 ---扩展如果是cnpm的话 cnpm run serve //运行项目

配置

选择是否配置https://registry.npm.taobao.org网址为源进行提速

Manually select features 手动选择

自由选择配置(linter/fromater 插件会检查你的代码变量定义后是否使用)空格键来选择和取消

选择vue开发版本

下面一些选项自己选择

项目创建完成后使用以下命令启动项目

2.setup用法

setup函数是Composition API(组合api)的入口

setup是启动页面后会自动执行的一个函数

项目中定义的所有变量,方法等都需要在setup中

在setup函数中定义的变量和方法最后都需要retun出去,否则无法在视图层中使用

export default{

setup(){

const name = '张三'

const age = 30

const act = '购买'

const btn = () =>{ const res = `${age}岁的${name}${act}了服务器` console.log(res); }

return {name,btn}

}

}


哈喽大家好!欢迎感兴趣的小伙伴一起学习vue3,共勉。

项目   vue   steup
发表评论
留言与评论(共有 0 条评论) “”
   
验证码:

相关文章

推荐文章