Vue
一天不学习感觉像头猪
这个作者很懒,什么都没留下…
展开
-
vue cli脚手架路由搭建
旧版vue init功能,可以安装全局网桥:npm install -g @vue/cli-init新建vue项目vue init webpack 项目名称安装运行依赖npm install 安装css-loadernpm install style-loader -Dvue项目运行自动打开浏览器:autoOpenBrowser: false...原创 2019-08-30 13:50:04 · 124 阅读 · 0 评论 -
vue的数据双向绑定
在Vue实例里面定义data:inputMod和list, 视图层input中绑定v-model="inputMod",button绑定点@click="inpuBut", 当input输入数据,点击button的时候,就会把操作input里的数据,通过点击事件函数push添加到list,list通过循环输出到视图<div id="app"> <input typ...原创 2019-10-31 21:18:10 · 96 阅读 · 0 评论 -
vue生命周期
vue的生命周期:开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、销毁等一系列过程原创 2019-10-31 16:10:13 · 71 阅读 · 0 评论 -
vue数据加载优化
App.vue,加上keep-alive这个组件之后router里的数据文件加载过一次之后,就会把数据存储在keep-alive这个组件,当下一次重新渲染这个页面的时,就会把之前存储的数据释放出来,就不用了重新再去钩子里加载数据<template> <div id="app"> <keep-alive exclude="Detail">...原创 2019-10-30 19:51:22 · 291 阅读 · 0 评论 -
vue路由跳转页面问题
当页面很长滚动首页时,点击滚动位置所在页面,跳转之后的子页面也会跟着到之前首页滚动到的位置,解决方法在routes下面再加一项export default new Router({ routes: [ { path: '/', name: 'Home', component: Home }, { path: '/...原创 2019-10-30 00:34:23 · 403 阅读 · 0 评论 -
vue递归组件使用
父组件Detail<template> <detail-list :list="list"></detail-list></template><script>import DetailList from './components/List'export default{ name:'Detail', ...原创 2019-10-29 23:05:39 · 195 阅读 · 1 评论 -
vue非父子组件传值方法,Vuex(2)
安装vuex插件npm install vuex --save1.创建index.js ,定义默认数据import Vue from 'vuex'Vue.use(Vuex)//创建一个仓库,存储共用的内容export default new Vuex.Store({ state:{ city:'北京' }})2.在main.js引入使用:...原创 2019-10-29 01:42:30 · 433 阅读 · 0 评论 -
better-scroll滚动插件的使用
安装插件npm install better-scroll --save使用插件<div class="search-content" ref="search"></div> //获取这个dom<script>import Bscroll from 'better-scroll' //引入插件 mounted(){ //传入...原创 2019-10-28 21:41:44 · 83 阅读 · 0 评论 -
vue非父子组件传值方法,子组件1→父组件→子组件2(1)
思路:子组件1→父组件→子组件2子组件1<template> <div @click="handlCilck"></div></template><script> name:'CityHeader', methods:{ bindlClick(e){ this.$emit('...原创 2019-10-28 16:26:26 · 132 阅读 · 1 评论 -
axios跨域插件的使用
父组件home.vue,子组件header.vue,数据文件index.json//父组件创建并传递数据<template> <home-header :city="city"></home-header></template><script>import axios from 'axios' //引入expo...原创 2019-10-27 14:51:27 · 157 阅读 · 0 评论 -
vue路由跳转
在router下的index.jsimport Router from 'vue-router'import Home from '@/pages/home/Home'import City from '@/pages/city/City'Vue.use(Router)export default new Router({ routes: [ { path...原创 2019-10-27 17:49:52 · 89 阅读 · 0 评论 -
Travel项目介绍
全局通过npm搭建vue的脚手架npm install -g @vue/cli-init开发使用的是单页应用:整体页面通过路由构建,并使用路由进行跳转开发之前注意:需重定义浏览器默认样式,HTML中绝大部分标签元素在网页显示中都有一个默认属性值,通常为了避免重复定义元素样式,需要进行重置默认样式,这里选择的是reset.css,通过在入口文件main.js中引入 解决1...原创 2019-10-24 20:21:58 · 439 阅读 · 0 评论 -
Vue CLI创建,npm run dev报错问题解决
报错?????1. 先查看node.js版本号2. 再看看webpack是4.x的,高级webpack版本会出错,我的是4.2.03. 全局卸载删除webpack4.全局安装个低版本的webpack,我的是:3.4.1然后查看版本号:5. 安装需要的依赖6. 再运行看看o的k,没问题了,完美解决。我现在这个点不吃饭,也不睡觉,继续...原创 2019-04-25 17:30:36 · 879 阅读 · 0 评论