随笔分类 - Vue
摘要:插槽内容使用方法介绍 父组件中引用支持插槽内容的子组件,形如以下(假设子组件为NavigationLink.vue) <navigation-link url="/profile"> Your Profile </navigation-link> 然后在子组件<template> 模板中使用<slo
阅读全文
摘要:# 基于VSCode结合Vetur+ESlint+Prettier统一Vue代码风格
阅读全文
摘要:vue中引用第三方js总结 By:授客 QQ:1033553122 实践环境 win10 Vue 2.9.6 本文以引用jsmind为例,讲解怎么在vue中引用第三方js类库 基础示例 1、把下载好的js类库放在src/static目录下 2、在src/index.html入口文件中通过script
阅读全文
摘要:基于vue+sortable.js实现表格行拖拽 By:授客 QQ:1033553122 实践环境 sortablejs@1.13.0 vue@2.6.11 element-ui@2.13.2 安装sortable.js拖拽库 npm install sortablejs 代码示例 <templat
阅读全文
摘要:基于vue-codemirror实现的代码编辑器 开发环境 jshint 2.11.1 jsonlint 1.6.3 script-loader 0.7.2 vue 2.6.11 vue-codemirror 4.0.6 element-ui 2.13.1 (使用到element-ui messag
阅读全文
摘要:Vue 给mapState中定义的属性赋值报错的解决方案 by:授客 QQ:1033553122 1. 实践环境 Vue 2.9.6 2. 问题描述 <script> import { mapState } from 'vuex'; export default { name: "displayCo
阅读全文
摘要:Vue 根据鼠标悬停目标元素上方显示、隐藏指定元素交互实现 By:授客 QQ:1033553122 开发环境 win10 element-ui "2.13.1" vue "2.6.10" 需求描述 如下,鼠标移动到左侧标签名称时,右侧展示删除按钮,否则不显示 关键实现代码如下: <template>
阅读全文
摘要:Vue 在父(子)组件引用其子(父)组件方法和属性 by:授客 QQ:1033553122 开发环境 Win 10 element-ui "2.8.2" Vue 2.9.6 父组件代码 <template> <div> <button @click="callChildMethod()">父组件调用
阅读全文
摘要:Vue 阻止事件冒泡 by:授客 QQ:1033553122 开发环境 Win 10 element-ui "2.8.2" Vue 2.9.6 事件冒泡简介 如下图,当我们点击页面某个元素时,会产生点击事件,事件由外到内,逐层递进(事件捕获阶段,途中的1->2->3->4),当目标元素捕捉到目标事件
阅读全文
摘要:Vue 使用Use、prototype自定义全局插件 by:授客 QQ:1033553122 开发环境 Win 10 node-v10.15.3-x64.msi 下载地址: https://nodejs.org/en/ 实现方式1 1. src目录下新建plugin目录 2. plugin目录下新建
阅读全文
摘要:Vue 新增不参与打包的接口地址配置文件 by:授客 QQ:1033553122 开发环境 Win 10 Vue 2.5.2 问题描述 vue工程项目,npm run build webpack方式打包,每次打包后如果需要更改后台接口地址(项目中,接口地址设置成变量,存放在js文件中,需要用到的地方
阅读全文
摘要:Vue 打包后自定义样式无法覆盖elementUI组件原有样式问题 by:授客 QQ:1033553122 开发环境 Win 10 node-v10.15.3-x64.msi 下载地址: https://nodejs.org/en/ 问题描述 如下为基于elementUI Dialog编写的一个组件
阅读全文
摘要:vscode 常用设置 by:授客 QQ:1033553122 版本 vscode Version: 1.33.1 1. 自动保存文件设置 文件编辑一秒钟过后自动保存 2. 黏贴后、保存完、输入完后自动化格式 3. 代码行可容纳字符数及换行设置 bounded 超过word Wrap Column设
阅读全文
摘要:Vue export & export default & import 总结 by:授客 QQ:1033553122 1. 实践环境 Vue 2.9.6 2. 简介 在ES6中,export与export default均可用于导出变量(含常量)、函数、类、文件、模块等,然后在其它文件或模块中通过
阅读全文
摘要:结合html2canvas和jsPDF实现html页面转pdf By:授客 QQ:103355122 实践环境 win10 Vue 2.9.6 axios 0.18.0 html2canvas 1.0.0-rc.3 jspdf 1.5.3 安装 html2canvas 进入vue项目所在目录,然后执
阅读全文
摘要:Vue 修改网页标题和图标 by:授客 QQ:1033553122 开发环境 Win 10 Vue 2.5.2 需求描述 如下,想更改网页的标题和图标 解决方法 编辑项目根目录下的index.html,如下: 更改标题: 修改<title>元素内容即可 修改图标: 把要修改的图片放static目录下
阅读全文
摘要:Vue实现动态路由及登录&404页面跳转控制&页面刷新空白解决方案 by:授客 QQ:1033553122 开发环境 Win 10 Vue 2.9.6 node-v10.15.3-x64.msi 下载地址: https://nodejs.org/en/ 代码片段(router/index.js) 说
阅读全文
摘要:Vue 嵌套路由使用总结 by:授客 QQ:1033553122 开发环境 Win 10 node-v10.15.3-x64.msi 下载地址: https://nodejs.org/en/ 需求场景 如下图,我们希望点击导航栏不同菜单时,导航栏下方加载不同的组件,进而展示不同的页面内容 解决方案
阅读全文
摘要:Vue项目目录结构梳理 by:授客 QQ:1033553122 1. 结构梳理 . ├── build/ # webpack 配置文件; │ └── ... ├── config/ # 与项目构建相关的常用的配置选项; │ ├── index.js # 主配置文件 │ ├── dev.env.js
阅读全文
摘要:基于node npm & vue-cli & element UI创建vue单页应用 开发环境 Win 10 node-v10.15.3-x64.msi 下载地址: https://nodejs.org/en/ 安装node 安装vue-cli 1、安装node-v10.15.3-x64.msi 2
阅读全文