Sky~的博客

在项目中安装route和vue-routernpm i routenpm i vue-router创建/src/router/index.js文件//引入vue-routerimport VueRouter from "vue-router";//引入需要路由的组件import About from "@/components/About";//引入需要路由的组件import Home from "@/components/Home";//创建并暴露VueRouterexpo.

在项目中导入Vuexnpm i vuex创建并配置文件 /src/store/index.js//引入Vue核心库import Vue from 'vue'//引入Vueximport vuex from "vuex";//使用Vuex插件Vue.use(vuex)//准备 actions 对象 ， 响应组件用户动作const actions ={}//准备 mutations 对象 ， 修改state中的数据const mutations = {}// 准备 state..

使用axios 和 json-server 模拟前端与后端的数据交互首先，在电脑上安装json-server 并在项目中导入axiosjson-server 的安装：npm install -g json-server 在项目中导入axios (要在你的项目路径下使用该命令)npm i axios准备一个使用的json文件，模拟后台数据如：创建一个db.json文件，里面内容如下{“students”: [{“id”: “1”,“name”: “李利”,“age”: 21..

组件自定义事件 <Student>为子组件 父组件获取子组件的数据 1. 现在子组件中自定义一个事件，如下： <script> methods:{ getStudent(){ //定义一个名为getstu 的事件,通过别的组件调用来获取该组件的name属性 this.$emit('getstu',this.name) } } </s.

ref元素被用来给元素或者子组件注册引用信息用在html标签身上，可以获取到他的真实dom元素，等同于使用id来获取document，如下所示<template> <div> <h1 v-text="text" id="h" ref="h"></h1> <button @click="getResult"></button> <School></School>//这里的sch.

安装npm环境 （node.js）下载链接：https://nodejs.org/zh-cn/download/以下操作均在dos窗口中完成配置npm淘宝镜像（可以让下载速度变快点）npm config set registry https://registry.npm.taobao.org安装 vue脚手架npm install -g @vue/cli创建vue脚手架项目使用dos命令切换到你想要创建项目的文件路径下vue create 文件名选择创建项目的版本 vue2 或 .

条件渲染v-show and v-if 当v-show 和 v-if 里面的条件判定为真的话，就渲染对应的标签容器等（就是在页面中显示出来） 当v-show 和 v-if 里面的条件判定为假的话，就会隐藏起来 样例代码如下： <div id="app"> <p v-show="true">这是v-show的标签</p> <p v-show="a">这是v-show的标签</p&g.

创建vue实例 <script> //创建vue实例 const vm = new Vue() </script>配置对象1.el<div id="app"> <h1>My Test Vue</h1> </div> <script> //创建vue实例 const vm = n.

1.引入Vue—1.1通过CDN引入 <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>1.2下载到本地—1.2.1 进入Vue官网下安装 https://cn.vuejs.org/v2/guide/—1.2.2将下载好的vue.js导入到项目中即可2.安装Vue开发者工具（可以不安装）—2.1 在浏览器的设置中打开开发者模式—2.2 工具下载链接 htt