vue
关注
分享
扫一扫
g0415shenw
Stay hungry,Stay foolish
音视频交流群：759117824
GB28181技术交流群：708251501
UE4技术交流群：1036326334
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
Vue之设置背景图片
放置背景图片路径：设置背景图片<template> <div class="background"> <img :src="imgSrc" width="100%" height="100%" alt="" /> </div></template><script>export default { data () { return { imgSrc: require('../.原创 2020-09-24 10:51:32 · 3183 阅读 · 2 评论 -
Vue之使用a-model隐藏按钮
<a-modal v-model="visible" title="Title" centered width="1100px"> <template slot="footer"> <a-button key="back" v-show="false"> Return </a-button> <a-button key="submit" v-show="false"...原创 2020-09-24 18:07:30 · 3493 阅读 · 0 评论 -
Vue之代码自动格式化
用vscode写vue程序，实现代码的自动格式化。首先安装插件：然后进行配置：依次点击顺序：File----》Preferences----》Settings然后切换到文本格式，最后拷贝下面的内容{ // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tabsize "editor.tabSize": 2, // #每次保存的时候自动格式化 "e..原创 2020-09-24 14:12:48 · 3082 阅读 · 0 评论 -
Vue之弹出一个非模态框
目前还没有思路，真正研究原创 2020-03-05 17:37:01 · 1679 阅读 · 2 评论 -
Vue之Npm加速
默认的node的npm太慢了，这里使用淘宝的cnpm网址如下：http://npm.taobao.org/使用方法npm install -g cnpm --registry=https://registry.npm.taobao.org然后，后面就使用 cnpm进行操作了。...原创 2020-02-10 15:36:48 · 367 阅读 · 0 评论 -
Vue之ie11
安装补丁win7下ie11补丁https://www.microsoft.com/zh-CN/download/confirmation.aspx?id=45154初始化：npm init -y安装webpacknpm install webpack webpack-cli --save-dev安装vuenpm i --save-dev vue vue-load...原创 2019-12-23 21:31:00 · 424 阅读 · 0 评论 -
Vue之webpack打包CSS图片字体
初始化：npm init -y安装webpacknpm install webpack webpack-cli --save-dev安装vuenpm i --save-dev vue vue-loader vue-template-compiler 安装css的插件npm install --save-dev style-loader css-loader...原创 2019-12-23 12:24:16 · 414 阅读 · 0 评论 -
Vue之webpack之vue
第一步：npm init -y第二步：npm install --save-dev vue 第三步：npm i --save-dev vue-loader vue-template-compiler 第四步：npm install webpack webpack-cli --save-dev添加配置文件：webpack.config.jsc...原创 2019-12-22 22:05:28 · 280 阅读 · 0 评论 -
Vue之webpack之Babel
现在想把es6的代码，转成es5的代码。记录一下方法：首先新建一个webpack_babel然后执行npm init -y会自动生成一个package.json的文件安装babel插件：npm install --save-dev babel-loader @babel/core @babel/plugin-transform-runtime @babel/r...原创 2019-12-22 19:21:27 · 511 阅读 · 0 评论 -
Vue之webpack之基本使用
第一步：新建一个空包的文件夹，vue_webpack第二步：用vscode打开，输入npm init -y会生成一个package.json的文件第三步：安装webpack 输入npm install webpack会多出一个依赖第四步：生成一个index.html文件，以及main.js文件快捷键 ！ 再加上回车第五步：新建一个webpa...原创 2019-12-21 18:23:38 · 266 阅读 · 0 评论 -
Vue之$options
this.$options 可以获取自定义属性时。直接举个例子吧：<template> <div> <el-button @click="handleclick">点击</el-button> <label>自定义属性显示</label> <el-input type="text" ...原创 2019-08-15 15:49:53 · 15199 阅读 · 3 评论 -
Vue之call
call 是js语法。。。今天遇到了，就写几个demo ，了解一下他的原理。var test = { add:function (a) { return a+1 }}var addfun = test.addconsole.log(addfun.call(test,1))console.log(test.add(5))输出如下：如果是函数调...原创 2019-08-20 17:18:45 · 4150 阅读 · 1 评论 -
Vue之mixin
这里引用vue官方的解释：https://cn.vuejs.org/v2/guide/mixins.html混入 (mixin) 提供了一种非常灵活的方式，来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。用大白话的意思就是，可以写个对象，当另一个对象把这个对象作为混入之后，另一个...原创 2019-08-15 14:48:40 · 241 阅读 · 0 评论 -
Vue之Proxy
proxy是es6的语法，Proxy可以理解成，在目标对象之前架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，因此提供了一种机制，可以对外界的访问进行过 滤和改写。Proxy这个词的原意是代理，用在这里表示由它来“代理”某些操作，可以译为“代理器”。写一个get的代理方法：var person ={ name:'zhangshan'}var proxy = new ...原创 2019-08-20 15:43:27 · 1646 阅读 · 0 评论 -
Vue之路由
Vue的路由，好强大，这里简单的记录一下我使用的路由的一些笔记。参考：https://router.vuejs.org/zh/直接上一个代码import Vue from 'vue'import Router from 'vue-router'import HelloWorld from '@/components/HelloWorld'import ElementT...原创 2019-08-14 14:42:54 · 238 阅读 · 0 评论 -
Vue之父子组件通信
有时候，需要在父组件把数据传递给子组件，也有时候，需要把子组件的数据，传递给父组件。这里先来研究第一个，父组件把数据传递给子组件。这里使用props参考vue.js官方介绍https://cn.vuejs.org/v2/api/#propsprops 可以是数组或对象，用于接收来自父组件的数据。props 可以是简单的数组，或者使用对象作为替代，对象允许配置高级选项，如类...原创 2019-08-14 14:31:53 · 232 阅读 · 0 评论 -
Vue之axios
Axios是进行http通信的组建，今天尝试使用一下。参考下面的https://github.com/axios/axios下载地址https://unpkg.com/axios/dist/axios.min.js写一个简单的测试demo<!doctype html><html> <head> <title&g...原创 2019-07-12 11:04:54 · 238 阅读 · 0 评论 -
Vue之npm相关
使用默认的npm源的时候，速度好慢，这里想修改npm源。。先查看原有的npm源npm config get registry 可以看出我现在默认的是npm官网的地址，所以反应比较慢。现在我要修改为淘宝的镜像npm config set registry https://registry.npm.taobao.org查看镜像，显示设置成功*******...原创 2019-07-29 10:55:12 · 266 阅读 · 0 评论 -
Vue之Promise
Promise可以实现异步方法，这里主要讨论resolve 和reject 两个参数。直接看实例，可能比较直观 increment (context) { return new Promise((resolve, reject) => { setTimeout(() => { context.commit('incr...原创 2019-08-02 16:08:10 · 6832 阅读 · 1 评论 -
Vue之脚手架第一个项目
安装参考下面网址：vuecli的官网https://cli.vuejs.org/zh/guide/installation.html安装完之后，输入命令：vue init <template-name> <project-name>init：表示我要用vue-cli来初始化项目<template-name>：表示模板名称，vue-cl...原创 2019-07-30 15:42:22 · 450 阅读 · 0 评论 -
Vue之安装Google开发插件
下载地址：https://github.com/Ezoio/IMI-SOURCE-CODE下载文件插件安装：提示如下错误：上面的方法不行了，重新换个方法。。2019年4月18日版本5.1.0网盘地址：链接：https://pan.baidu.com/s/1kVPC-TrUs4_niYvaZ_JfAQ 提取码：4d7s 找到上面的版本...原创 2019-07-31 15:07:08 · 3775 阅读 · 0 评论 -
Vue之表单rules
我使用的是element-ui进行表单认证，实例如下：<template> <el-form :rules="loginroules" > <el-form-item prop="username"> <el-input name="username" type="text" v-model="logi...原创 2019-08-01 17:17:42 · 1150 阅读 · 0 评论 -
Vue之路由beforeEach
beforeEach这个函数可以实现路由跳转的拦截，，但是有个很大问题。。。。原以为router.beforeEach((to, from, next) => { console.log('cheshi') next({path: '/eleform'})})可以直接跳转到我想要的页面，，但是其实又进去了beforeEach函数。。测试一下：最后报错，说明前面的猜...原创 2019-08-01 18:12:07 · 982 阅读 · 0 评论 -
Vue之vuex
vuex是用来保存一个全局的数据，可以与多个组件进行绑定。使用流程如下，先定义一个storeVue.use(Vuex)const store = new Vuex.Store({ state: { count: 0 }, mutations: { increment (state) { state.count++ }, decr...原创 2019-08-02 11:37:28 · 264 阅读 · 0 评论 -
Vue之路由push
Vue除了使用router-link 来实现页面跳转之外，还可以直接使用js代码实现页面跳转。那就是push，使用this.$router.push({path: '/'})可以实现<li><router-link to="/">Vue页面</router-link></li>一样的能力。<template> <div...原创 2019-08-13 15:01:05 · 1646 阅读 · 0 评论 -
Vue之组件引用
有时候，我们希望在一个vue界面引用另外一个vue界面，这个时候就可以使用vue组件引用了。首先写写一个vue组件，名字为MyCate<template> <div> <label>cat</label> <label>cat</label> <label...原创 2019-08-13 15:41:07 · 378 阅读 · 0 评论 -
Vue之ElementUI导航菜单
参考如下：https://element.eleme.io/#/zh-CN/component/menu先直接遍历路由列表，显示需要显示的导航元素。 <el-menu :default-active="$route.path" mode="horizontal" @select="handleSelect"> <template v-for="(ite...原创 2019-08-13 17:39:19 · 2579 阅读 · 0 评论 -
Vue之import
经常看到vue的代码里面有import，这里把几种情况总结一下。case1：如果使用export default 导出的对象，在import的时候，可以任意命名。<template> <div> <label>cat</label> <label>cat</label> ...原创 2019-08-14 10:29:27 · 856 阅读 · 0 评论 -
Vue之安装vscode
参考上面的博客https://blog.youkuaiyun.com/mao834099514/article/details/79138484由于项目需要，需要掌握Vue开发，所以决定用vscode搭建一个开发环境。第一步：下载nodejs，官网地址https://nodejs.org/zh-cn/直接默认安装即可。检查nodejs与npm安装情况node -v...原创 2019-06-30 12:16:10 · 927 阅读 · 0 评论