今天第一次使用Sublime Text3软件，在实现vue文件高亮显示的过程中一直报错，经过了半天时间的不停尝试终于找到了最有效的一种解决方法！错误提示如下：刚开始尝试了很多方法都不行，只要打开install Package就报错。无论是取消掉网络配置里的ipv_6选项，还是在hosts文件中添加映射也都不能解决问题。最后上网查找发现了一个真正有效的解决办法：remove package control and then re-install it manually。（转自http://www.cnblog...
[vue-pdf] npm连接:https://www.npmjs.com/package/vue-pdf安装vue-pdfnpm i vue-pdf1.解决字体问题 将node_modules/pdfjs-dist/cmaps文件夹复制到public文件夹下 (找不到的可以看下代码怎么写的，node_modules/vue-pdf/src/CMapReaderFactory.js)2.上传预览<template><div><el-uploadclass="upload-demo" drag action="#" :auto-upload="false":on-change=‘fileChange‘:limit=‘1‘multiple><i class="el-icon-upload"></i><...
编写html，通过vue-resource.js库向后台提交数据 <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>用户注册</title><link href="bootstrap-4.3.1-dist/css/bootstrap.min.css" rel="stylesheet"><script src="js/jquery.js"></script><script src="bootstrap-4.3.1-dist/js/bootstrap.js"></script><script src="js/vue.js"></script><!-- 异步提交的库 --><script src="js/vue-resource.min.js"></script><st...
http://localhost:8080/login/sss # 效果实现前 http://localhost:8080/login # 效果实现后 方法：使用Vue组件的name属性进行跳转原文：https://www.cnblogs.com/guanxiying/p/13179808.html
使用HBuilderX实现打包vue项目成app：https://www.cnblogs.com/wuzhiquan/p/10594855.html 一、准备开发工具开发工具：HBuilderX官网地址：http://www.dcloud.io（标准版需要自己安装插件，app开发版已经把app开发常用的插件安装好了，开箱即用，建议使用开发版）二、打包生成一个vue项目就拿手头上一个vue项目进行打包，vue项目预览如下：打包生成的项目结构：三、创建HBuilder的app项目（请先注册HBuilde账号并登录，打包的时候需...
项目地址：https://github.com/caochangkui/vue-cli3项目代码：城市列表首页：City.vue<template><div id="city"><!-- <img src="/logo.png" alt="" height="10px"> --><div class="word" v-show="showWord"><span>{{letter}}</span></div><div class="title">城市选择</div><city-list:cities="cities":hot="hotCities":letter="letter"></city-list><city-alphabet:cities="cities"@change="handleLetterChange"></city-alphabet...
由于项目的扩展，新增了很多功能，今天谈一下短信验证码框的实现。思路：每个小方框其实就是单独的每一个input标签（叫假input标签），每个长度为1，然后上面再写一个大的input标签（叫真实input标签），提高层级定位在上方，最大长度为6，然后将上方真实input标签的值传给每一个单独的假input标签。<div class="phonenum-show"><div class="getback-title">收回剩余礼金 <span @click="getbackMoneyclock()"><img src=".....
1.安装router我就不贴代码了，先看看咱们需要实现的功能，点击左侧侧边栏实现中间main的变化 2.在components文件下创建page1 和page2 内容随便写。为了方便，我贴一下代码 3.router目录下的idnex.js 把这两个路由加上 4.app.vue里面使用刚才的路由，为了你们方便，我直接上代码 <el-container> <el-aside width="200px"> <el-menu default-active="this.$route.path" router> <el-submenu index=""...
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <link rel="stylesheet" href="./animate.min.css" /> <script src="./vue.js"></script> <style> .box { width: 100px; height: 100px; background-color: red; } .custom-enter-active { a...
上一篇文章我们讲了如何在electron-vue中实现后台进程并与渲染进程进行通讯。但是添加的进程代码脱离于electron之外，如果我们想在worker中使用package.json中引入的第三方库，该怎么做呢？首先，我们要知道package.json文件中的第三方库是怎么被引入到vue之中的。package.json文件是webpack的一个重要组成部分，而webpack则是大名鼎鼎的js模块打包组织工具。electron-vue框架已经引入了webpack对vue代码的管理，我们要做的就是，将...
一、安装依赖包 或是 npm install --save-dev sass-loader npm install --save-dev node-sass二、配置 原文：https://www.cnblogs.com/Annely/p/13266474.html
问题背景：有时候一些列表会有一些跳转的需求，比如跳到详情页、或者是其他相关的页面（比如跳到用户列表去查看用户的相关信息）等，此时再返回列表页，列表页会刷新重置。目前需求就是需要改成如下情况： 问题1、列表 - 详情页，返回，不刷新重置； 问题2、再点其他菜单，再返回，需要刷新重置。 解决思路： 解决需求自然是想到vue的keep-alive去缓存组件，但是缓存组件有个不好的弊端，就是以后再进入页面也一直保持...
在写vue的项目的时候，弹框经常性出现，并要求点击弹框外面，关闭弹框，那么如何实现呢？且听我一一。。。不了，能实现效果就好<template><div><div class="show" v-show="show" v-clickoutside="handleClose">显示</div></div></template><script> const clickoutside = {// 初始化指令 bind(el, binding, vnode) {function documentHandler(e) {// 这里判断点击的元素是否是本身，是本身，则返回if (el.contains(e.target)) {...
一、概念 通过改变 URL，在不重新请求页面的情况下，更新页面视图。 二、实现方式 更新视图但不重新请求页面，是前端路由原理的核心之一，目前在浏览器环境中这一功能的实现主要有2种方式： 1.Hash --- 利用 URL 中的hash("#"); 2.利用 History interface 在HTML5中新增的方法。 Vue 中，它是通过 mode 这一参数控制路由的实现模式： const router=new VueRouter({mode:‘history‘,routes:[...] }) 创...
1.html <div class="filter-nav" v-for="(item,index) in filterData.navTab" :key="index" :class="{‘active‘:currentSort==index}" @click="active(index)"><span>{{item.name}}</span><i v-if="item.icon" :class="‘fa fa-‘+item.icon"></i></div>2.在循环的代码那里添加 :class="{‘active‘:currentSort==index}"3.添加样式.active {color: #009eef; }4.初始化数据 data() {return {currentSort:0,}},5.调用方法 meth...