vue
关注
分享
扫一扫
程序员小哲
微信公众号同名：带你在职搞副业
展开
-
vue 安装教程
下载node.js下载网址：https://nodejs.org/en/download/检查nodejs版本node --version检查npm的安装情况npm -v安装 cnpmnpm install cnpm -g安装vuecnpm install vue全局安装 vue-clicnpm install --global vue-cli以上代码运行一次即可创建一个基于 webpack 模板的新项目vue init webpack “相对路径/原创 2020-09-28 13:32:32 · 3619 阅读 · 6 评论 -
vue基础语法
插入值：{{}}插入HTML：v-html标签属性：v-bind（简写 : ）条件渲染1：v-if条件渲染2：v-else条件渲染3：v-if-else条件渲染4：v-show（隐藏）列表渲染：v-for < h3 v-for="(item,index) in names" v-bind:key=“index”>{{item}}{{index}}</ h3>事件监听：v-on:click（简写 @ ）输入绑定：v-model...原创 2020-09-29 08:29:51 · 2176 阅读 · 2 评论 -
vue -- 数组操作
数组操作根据下标修改数组元素：setthis.$set(this.list,0,{messsage:"11"})根据下标在指定的位置加入、修改、删除元素//在下标为的2数组元素前插入数据this.list.splice(2,0,{mee:"11"})//修改下标为2的数组元素this.list.splice(2,1,{mee:"11"})//修改下标为2和3的元素this.list.splice(2,2,{mee:"11"})//删除下标为2的一个元素this.list.sp原创 2020-10-10 13:32:32 · 2695 阅读 · 2 评论 -
vue 插槽的使用
父组件<template> <div id="app"> <HelloWorld1> <template v-slot:s1> {{ width }} </template> <template v-slot:s2> {{ hight }} </template> </HelloWorld1> <原创 2020-10-09 17:28:28 · 2361 阅读 · 0 评论 -
vue 父子传值 方法大全
vue 父子传值 方法大全一、通过props传递数据父页面子页面二、子控件给父控件传递值父页面子页面三、插槽slot四、vuex一、通过props传递数据只能是父控件传递给子控件父页面<template> <div id="app"> <HelloWorld1 width="400" height="500" arr="[1,2,3,4,5]" /> </div></template><script>i原创 2020-10-09 22:40:33 · 3421 阅读 · 8 评论 -
vue -- axios安装 入门使用
vue axios进阶–以面向对象的思维 对 vue axios 进行封装安装axois进入项目目录文件，进入cmd命令：npm install axios --save在main.js中引入将axios挂载到Vue原型中import Vue from 'vue'import App from './App'import axios from 'axios'Vue.prototype.$axios=axiosVue.config.productionTip = false/*原创 2020-10-10 14:13:03 · 4562 阅读 · 11 评论 -
vue -- 路由安装 入门使用
安装路由cnpm install --save vue-router配置路由创建src/router/index.js目录，输入以下代码import Vue from 'vue'import Router from 'vue-router'import HelloWorld from '../components/HelloWorld'Vue.use(Router);export default new Router({ routes:[ {原创 2020-10-10 13:49:48 · 1535 阅读 · 4 评论 -
vue 安装并导入 Element UI
第一步安装Element UI首先进入vue项目所在的cmd目录输入：npm i element-ui -S配置main.js文件在配置文件中加入这三句话，引入Element UIimport ElementUI from ‘element-ui’;import ‘element-ui/lib/theme-chalk/index.css’;Vue.use(ElementUI);import Vue from 'vue'import App from './App'import V原创 2020-10-05 12:49:36 · 4382 阅读 · 4 评论 -
vue 解决页面刷新问题 -- 路径改变页面不改变
在main.js中的< router-view >< /router-view >里面加入:key="key"即可！<template> <div> <router-view :key="key()"></router-view> </div></template><script> export default { name: 'App', methods:{.原创 2020-10-05 12:16:50 · 3322 阅读 · 3 评论 -
安装配置vuex
vuex快速入门 - - 简单的 state与mutations 操作（创建仓库、修改仓库、读取仓库）安装vuex打开控制台进入项目所在路径输入以下命令：npm install vuex --savecnpm install es6-promise --saveimport 'es6-promise/auto'//（注意：此引入在引用vuex之前添加）import Vuex from 'vuex'Vue.use(Vuex)...原创 2020-10-09 19:04:45 · 1271 阅读 · 0 评论 -
vuex 简单的 state与mutations 操作（创建仓库、修改仓库、读取仓库、计算属性）
打开控制台进入项目所在路径输入以下命令：npm install vuex --savecnpm install es6-promise --saveimport 'es6-promise/auto'//（注意：此引入在引用vuex之前添加）import Vuex from 'vuex'Vue.use(Vuex)原创 2020-10-09 16:48:30 · 2478 阅读 · 0 评论 -
以面向对象的思维 对 vue axios 进行封装
axios 请求拦截axios.interceptors.request.use(function(config){ console.log(config.url); //将路径进行加工，在请求路径前加上请求路径。 //后端处理跨越方式 //config.url="http://localhost:8080/demo/"+config.url; //前端处理跨越方式 config.url="/demo/"+config.url; //必须返回请求参数，不然请求不到后台。 r原创 2020-10-09 14:09:41 · 1477 阅读 · 3 评论 -
vue 过滤器实例
使用方法：{{字符串|局部过滤器得名字}}原创 2020-10-06 08:13:37 · 1619 阅读 · 2 评论 -
Vue生命周期八大钩子函数
方法名含义beforeCreate在数据初始化的之前被调用，这时候data和methods还没有数据created在数据初始化之后被调用，这时候data和methods有了相应的数据beforeMount页面尚未被渲染时使用，就是Vue的数据还没有传到页面mounted页面渲染完成之后使用，也就是此时页面已完全取出Vue中的数据beforeUpdatedata数据更新前updateddata数据更新beforeDestroy组件销毁之前...原创 2020-10-05 13:34:17 · 1970 阅读 · 3 评论 -
vue路由改写--前置守卫验证是否登录
vue路由前置守卫首先需要改写原有（默认生成）的路由把原有路由直接导出对象改成导出了一个函数router/index.js(前置路由验证是否登录)验证是否登录成功，即验证登录后设置session中的loginuser是否有值。import Vue from 'vue'import Router from 'vue-router'import login from '../components/login'import mian from '../components/mian'imp.原创 2020-10-05 12:56:50 · 2349 阅读 · 0 评论 -
Spring Boot + Mybatis + Vue + Element Ui项目实战总结（没有写完，每日更新一部分，关注方便查看后续）
这个博客主要是上一个项目的心得体会，文章很长，还没有写完，每日更新一部分，关注方便查看后续本次项目使用的主要框架是:Spring Boot + Mybatis + Vue + Element Ui一、Spring Boot（环境配置，以及重难点）1、IDEA的安装（IntelliJ IDEA 2...原创 2020-04-08 08:33:57 · 18478 阅读 · 4 评论 -
asiox突然不好使了，但是以前好使（解决办法）
今天在开发项目的时候，突然axios提示了跨越的错误！！！这是为什么呀，当初改了两天的错误怎么又出现啦！！！这个可能是一个小错误，希望对个别和我一样大意的人不要再犯。localhost != 127.0.0.1如下两个显示的当然都是一个界面。一、http://localhost:8080/html/upload.html二、http://127.0.0.1:8080/html/up...原创 2020-03-27 14:15:58 · 5047 阅读 · 9 评论 -
hidden（选择隐藏）vue框架，登陆实战 -- CDN模式
vue框架有两个主要的隐藏显示工具v-show（为真或不为空显示，为假或为空为隐藏）彻底消失，不在文档流中占位，浏览器也不会解析该元素v-if（为真或不为空显示，为假或为空为隐藏）视觉上消失了，可以理解为透明度为0的效果，在文档流中占位，浏览器会解析该元素注意：测试代码需要联网环境下！代码代写服务，加我微信：ppz2759v-show（display:‘none’）<...原创 2020-03-29 11:02:52 · 7345 阅读 · 7 评论 -
vue循环展出图片
vue循环展出图片html代码js代码整体代码礼品格式是这样千万别写错了！！！，再有问题私聊我，微信：ppz2759<img v-bind:src=“site.name” />html代码<!DOCTYPE html><html><head><meta charset="utf-8"><title>程序员小...原创 2020-03-08 21:05:27 · 5424 阅读 · 6 评论