Vue
菜鸭子
我回来了!!!
展开
-
【Vue笔记】Vue生命周期函数详细图解
Vue生命周期函数详细图解如下:原创 2019-08-03 16:17:16 · 262 阅读 · 0 评论 -
js利用定时器使当前页面缓慢移动到指定位置
需求是点击当前页面某一元素,结合定时器使页面缓慢移动到指定位置。说明一下,我这里用的是vue框架。 <div class="footer"> <a class="a-button" @click="scrollTo">start</a> </div>js代码注意:vue在同一个组件内,methods中的一个方法调用me...原创 2019-10-11 17:44:38 · 1074 阅读 · 0 评论 -
vue-cli3 取消eslint 校验代码 的解决办法
我这里用的是vue-cli3,遇到下图问题,在网上找了各种解决方法最后发现在vue.config.js文件修改lintOnSave 为false,如果没有就添加lintOnSave 为false重启一下就可以了...原创 2019-10-08 20:40:03 · 542 阅读 · 0 评论 -
解决vscode运行vue创建项目导入的外部css文件报错问题
最近用vue-cli 创建了一个项目,项目组件需要导入单独的css文件<style scoped> @import "/src/assets/css/demo.css";</style>路径没问题,代码没问题,可当运行起来的时候页面样式却无法加载搞了好久发现在settings.json文件添加如下代码即可解决问题{ "emmet.triggerE...原创 2019-10-08 20:31:08 · 2849 阅读 · 2 评论 -
解决vscode检测.vue文件中less部分报错方法
在使用 vscode 以及 eslint 来检测 vue-cli3 的项目中,vscode 无法检测到 .vue 文件中的less 部分内容。这时只需要在settings.json文件添加如下代码即可解决{ "emmet.triggerExpansionOnTab": true, "files.associations": { "*.vue": "vue"...原创 2019-10-08 20:24:29 · 2416 阅读 · 0 评论 -
vue-cli3构建项目引入Element-ui
最近在准备一个项目,打算结合Element-ui来构建。下面是Vue-cli3构建项目引入Element-ui组件的方法。首先,您需要@vue/cli全局安装,这里就不详细展开,大家可以到我另一篇博客参考。然后创建一个项目并添加Element插件:vue create my-appcd my-appvue add element之后你将被问到一些有关如何在项目中配置Element的问...原创 2019-10-04 15:42:30 · 578 阅读 · 0 评论 -
【Vue学习】Vue-cli3构建项目之TodoList效果vue组件化实现
我这里用到是Vue-cli3来构建项目。components文件夹用来存放vue组件,新建的vue组件 todolist.vue文件就是放在这里,根目录下的App.vue是根组件。App.vue<template> <div id="app" > <h1>TodoList</h1> <todolist></...原创 2019-10-02 21:49:09 · 344 阅读 · 0 评论 -
解决vscode安装vue后js文件不高亮问题
本来开开心心用vue-cli构建了项目结构,正打算开撸代码时发现js文件居然不高亮了!!!白花花的一片代码吓到我了!赶紧上网查找了教程,vetur插件安装了没用,setting.json文件也按网上设置了也没用……后面有看到一篇教程说要将vscode的本地缓存文件删掉,我立马去试了结果真的可以!!!这个是装vscode拓展插件的文件夹, 删除里面的vetur插件这个是装有历史记录的文件夹,...原创 2019-09-30 22:23:12 · 7501 阅读 · 4 评论 -
Vue-CLI 3.0快速构建项目
要用Vue-Cli快速构建项目首先要先安装Vue.在这里我用的是npm 命令安装。(怎么安装Node.js网上教程很多也很简单,这里就不一一展开了)初始化package.json文件$ npm initNPM在用 Vue 构建大型应用时推荐使用 NPM 安装[。NPM 能很好地和诸如 webpack 或 Browserify 模块打包器配合使用。同时 Vue 也提供配套工具来开发单文件...原创 2019-09-28 22:32:53 · 134 阅读 · 0 评论 -
【Vue笔记】 v-model指令与v-bind指令区别
v-bind 只能实现数据的单向绑定,从 M 绑定到 V ,无法实现数据的双向绑定。v-model 指令可以实现表单元素和 Model 中的数据的双向数据绑定。v-model 指令只能运用在表单元素。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> &l...原创 2019-08-02 09:50:44 · 871 阅读 · 0 评论 -
【Vue笔记】事件修饰符
Vue中事件修饰符:.stop 阻止冒泡.prevent 阻止默认事件.capture 使用事件捕获机制.self只有当事件在该元素本身(比如不是在子元素)触发时触发回调.once 事件只触发一次css代码如下:.outer{ padding:20px; background:blue;}.inner{ width:250px; height:...原创 2019-08-02 09:25:52 · 268 阅读 · 0 评论 -
vue 路由配置
我这里用的是vue-cli3搭建的项目,默认会有一个router.js文件在根目录下,到时候的路由配置放置在这里即可router.jsimport Vue from 'vue'import Router from 'vue-router'//引入组件import personalContainer from "@/components/perCenterComponent/person...原创 2019-10-11 18:34:13 · 206 阅读 · 0 评论