vue开发

安装nodejs

安装vue
npm install -g @vue/cli
选vue版本2

安装vue-router
npm install vue-router@2

创建项目
vue create vue_test
cd vue_test

启动项目
npm run serve

// 创建router实例
const router = new VueRouter({
//hash: 使用URL的hash值来模拟一个完整的URL，于是页面会一直停留在同一页面，但URL的hash部分会变化
//history: 利用HTML5 History API，它可以创建看起来像普通网页的URL，无需#。需要服务器支持
//abstract: 用于非浏览器环境
mode: 'history',
routes: [
{ path: '/', name: "home", component: HomePage },
{ path: '/hello', name: "hello", component: HelloWorld },
{ path: '/msg', name: "msg", component: ShowMyMsg },
]
})

vue访问接口
npm install axios

//Vue中的style scoped属性主要用于确保组件的样式只作用于当前组件，避免样式冲突。

加入element-ui
npm i element-ui -S

//https://blog.csdn.net/m0_52861684/article/details/143889308
//https://element.eleme.cn/#/zh-CN

vue项目使用vuex
npm install vuex@2 --save

使用vant做移动端开发
npm install vant@2

vue---移动端UI框架
https://www.cnblogs.com/e0yu/p/17014094.html
https://vant-ui.github.io/vant/#/zh-CN/quickstart

‌Vue的生命周期函数‌包括以下八个主要阶段：

‌beforeCreate‌：在实例初始化之后，数据观测和事件/侦听器设置之前调用。此时无法访问data、computed、methods等属性。
‌created‌：在实例创建完成后立即调用，此时data、computed和methods等已设置完成，但DOM还没有渲染。
‌beforeMount‌：在挂载开始之前调用，相关的render函数首次被调用，但DOM元素还没有挂载。
‌mounted‌：在实例挂载到DOM上之后调用，此时所有的data和computed已经绑定到DOM，可以进行DOM操作‌。
‌beforeUpdate‌：在数据更新之前调用，可以在此阶段进一步修改状态，不会触发重新渲染‌。
‌updated‌：在数据更新之后调用，此时DOM已经根据数据的变化更新了。
‌beforeDestroy‌：在实例销毁之前调用，此时实例仍然完全可用‌。
‌destroyed‌：在实例销毁后调用，此时实例不再存在，所有的绑定、子实例等都被解绑‌。

生命周期函数的作用和典型应用场景：

‌beforeCreate‌：用于进行一些全局的配置或初始化非响应式的数据。
‌created‌：适合进行数据请求、事件监听器的绑定等。
‌beforeMount‌：通常不需要使用，除非需要做一些特定的挂载前操作。
‌mounted‌：适合进行DOM操作、依赖于DOM的初始化等。
‌beforeUpdate‌：可以修改状态，不会触发重新渲染。
‌updated‌：适合进行视图更新后的操作。
‌beforeDestroy‌：清理资源，避免内存泄漏。
‌destroyed‌：确保所有清理工作完成。