随笔分类 - vue项目练习
组件化，路由等等
摘要：npm install element-ui -S 完整应用： import Vue from 'vue'; import ElementUI from 'element-ui'; import 'element-ui/lib/theme-chalk/index.css'; import App f
阅读全文
摘要：1.创建一个导航组件 2.路由的配置： import Vue from 'vue'import Router from 'vue-router'import Home from '@/components/nav/Home'import Mine from '@/components/nav/Min
阅读全文
摘要：1.router-link-exact-active 精准匹配 2.router-link-active 匹配 配置： import Vue from 'vue'import VueRouter from 'vue-router'//@表示寻找根目录import HelloWorld from '@
阅读全文
摘要：1.重定向 2.404 3.mode:"history" 4.this.$route.path 实例 import Vue from 'vue'import VueRouter from 'vue-router'//@表示寻找根目录import HelloWorld from '@/componen
阅读全文
摘要：App.vue <template> <div id="app"> <img src="./assets/logo.png"> <ul> <!-- <router-link to="/h" tag="li">HelloWorld</router-link> <router-link to="/lea
阅读全文
摘要：1.router.push 想要导航到不同的 URL，则使用 router.push 方法。这个方法会向 history 栈添加一个新的记录，所以，当用户点击浏览器后退按钮时，则回到之前的 URL。 2.router.replace 跟 router.push 很像，唯一的不同就是，它不会向 his
阅读全文
摘要：1.动态路由（参数传递） /:id 2.路由嵌套 import Vue from 'vue'import VueRouter from 'vue-router'//@表示寻找根目录import HelloWorld from '@/components/HelloWorld'import learn
阅读全文
摘要：1.单独的设置路由的index.js import Vue from 'vue'import VueRouter from 'vue-router'//@表示寻找根目录import HelloWorld from '@/components/HelloWorld'import learn from
阅读全文
摘要：1.路由注意2.安装npm install vue-router --save3.在项目中使用它，明确的通过Vue.use()安装路由功能import VueRouter from 'vue-router'Vue.use(VueRouter)4.创建路由//创建路由const router=new
阅读全文
摘要：1.跨域配置 proxyTable: { '/xxx_api':{ target: 'http://xxxcom', pathRewrite: { '^/xxx_api': '' }, changeOrigin: true } } mains.js Vue.prototype.HOST = "/xx
阅读全文
摘要：1.全局配置 axios.defaults.baseURL = 'https://api.example.com'; axios.defaults.headers.common['Authorization'] = AUTH_TOKEN; axios.defaults.headers.post['C
阅读全文
摘要：1.axios-post请求 <template lang="html"> <div class="hello"> HelloWorld! </div></template> <script> import qs from "qs"; // 解决参数格式的转码问题 ?name=xxxxx&age=1
阅读全文
摘要：_axios: vue >axios(网络请求) Axios是一个基于promise的HTTP库，可以用在浏览器和node.js中。 安装 npm install axios --save 引入： import axios from 'axios' Vue.prototype.$axios=Axio
阅读全文
摘要：Vue.js 允许你自定义过滤器，可被用于一些常见的文本格式化。过滤器可以用在两个地方：双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符号指示： 实例： <template lang="html"> <di
阅读全文
摘要：一个指令定义对象可以提供如下几个钩子函数 (均为可选)： bind：只调用一次，指令第一次绑定到元素时调用。在这里可以进行一次性的初始化设置。 inserted：被绑定元素插入父节点时调用 (仅保证父节点存在，但不一定已被插入文档中)。 update：所在组件的 VNode 更新时调用，但是可能发生
阅读全文
摘要：动画的方案： 1.在 CSS 过渡和动画中自动应用 class 2.可以配合使用第三方 CSS 动画库，如 Animate.css 3.在过渡钩子函数中使用 JavaScript 直接操作 DOM 4.可以配合使用第三方 JavaScript 动画库，如 Velocity.js 实现动画的元素必须脱
阅读全文
摘要：1.beforeCreate 2.created 3.beforemounted 在挂载开始之前被调用：相关的 render 函数首次被调用 4.mounted el 被新创建的 vm.$el 替换，并挂载到实例上去之后调用该钩子。如果 root 实例挂载了一个文档内元素，当 mounted 被调用
阅读全文
摘要：1.不具名slot; 2.具名slot; 3.父组件模板的东西在父级作用域内编译，子组件模板的所有东西在子级作用域内编译； 4.编译作用域 5.作用域插槽（数据传递） 6.数据可以动态的改变 App.vue <template> <div id="app"> <img src="./assets/l
阅读全文
摘要：1.new实例根目录的数据，其他组件可以随时访问，但是不推荐 2.通过computed方法访问new实例根目录的数据 main.js // The Vue build version to load with the `import` command// (runtime-only or stand
阅读全文
摘要：1.安装vue init webpack vuebase 2.按照描述填写信息；或者yes;no 3.进入项目目录：cd vuebase 3.安装npm : npm i 4.启动项目：npm start 动态或者静态的props props的type的校验 props中的类型是数组或者对象，必须返回
阅读全文
浙公网安备 33010602011771号