this.$confirm('您确定退出当前账号吗?', '提示', {                         confirmButtonText: '确定',                         cancelButtonText: '取消',                         type: 'warning'                     }).then(() => {   // 确定操作                         this

1.安装 npm install vue-quill-editor --save 2.使用 import { quillEditor } from 'vue-quill-editor' 3.组件中 <quill-editor v-model="content" ref="myQuillEditor" class="editer" :options="editorOption" @ready="onEditorR

官方网站:http://uikoo9.com/bootstrapQ why 事实上bootstrap已经非常好了,唯一的软肋就是js方面有些薄弱,对照easyui就知道了. 能够非常明显的知道bootstrap是前端人员创建的,而easyui是偏后端人员创建的. what 对bootstrap做了一些封装,能够使大家使用更方便,例如以下: 1.封装了alert 2.封装了confirm 3.封装了dialog 4.封装了msg 5.封装了tooltip 6.封装了popover 7.封装了bst

问题描述: 1.在vue里封装了一个confirm的弹窗(即如下一个弹窗) 2.发现在IOS微信客户端中打开后,当需要在表单中输入内容的时候,很自然的点击了键盘右上角的[完成]按钮 3.啊~~~,惊人的发现惊人弹窗里所有的按钮全部失效了,一点反应都没有 4.但是,发现只要不是使用的封装好confirm的弹窗,而是直接写入到页面中内容(即使用vue slot这个的时候就不会出现这个情况) 5.于是乎,我开始查阅度娘,最终在 https://www.jianshu.com/p/ba9cfaeef88

HTML: <!-- system modal start --> <div id="ycf-alert" class="modal"> <div class="modal-dialog modal-sm"> <div class="modal-content"> <div class="modal-header"> <button type

1.写在前面 最近在学习Vue2,遇到有些页面请求数据需要用户登录权限.服务器响应不符预期的问题,但是总不能每个页面都做单独处理吧,于是想到axios提供了拦截器这个好东西,再于是就出现了本文. 2.具体需求 用户鉴权与重定向:使用Vue提供的路由导航钩子 请求数据序列化:使用axios提供的请求拦截器 接口报错信息处理:使用axios提供的响应拦截器 3.简单实现 3.1 路由导航钩子层面鉴权与重定向的封装 路由导航钩子所有配置均在router/index.js,这里是部分代码 import

一.前言 博主也是vue道路上的行者,道行不深,希望自己的东西能对大家有所帮助.这篇博客针对 了解过vue基础,但是没有做过vue项目的童鞋.如果想看基础指令,可以看我之前的一篇博客,请点击  跳转,  不过我还是建议看文档比较好.os: Vue文档是非常详细的 二.准备 做vue单页应用都需要会什么? 1.  vue的脚手架,直接帮你建好项目.再看看自己想要啥,补充啥!  os:  Git 上有很多成品项目,可以找一个好点的拉下来 注: 路由按需加载.热加载 等这些都是基础功能,在这不多说.o

一.前言 之前的博客聊过 vue2.0和react的技术选型:聊过vue的axios封装和vuex使用.今天简单聊聊 vue 组件的封装. vue 的ui框架现在是很多的,但是鉴于移动设备的复杂性,兼容性问题突出.像 Mint-UI 等说实话已经很不错了,但是坑也是不少,而且项目中很多功能仅凭这些也实现不了,这需要我们去封装自己的可复用组件. 二.封装组件的步骤 1.  建立组件的模板,先把架子搭起来,写写样式,考虑好组件的基本逻辑. os:思考1小时,码码10分钟,程序猿的准则. 2.  准备

// vue2 组件封装如下: <template> <div> <div><!--vue element 组件的引用 Switch 开关 不懂请自行百度(重点参考js部分 如果不熟悉element switch略过就可以了)--> 语音播报 <el-switch v-model="openVoice" active-value="1" inactive-value="0" @change=&

导语 最近看到不少使用vue制作的音乐播放器,挺好玩的,本来工作中也经常使用Vue,一起交流学习,好的话点个star哦 本项目特点如下 : 1. 原生js封装自己的跨域请求函数,支持promise调用,支持错误处理 2. 制作一些复用性强的vue组件,如轮播图组件,支持手势滑动,无限循环,图片按需加载 3. 清晰明了的项目目录 项目仓库地址 项目演示地址 从项目中提取的banner组件地址 一.规划目录 一个易于维护和迭代的项目,应该是具有可靠的项目目录的,这里,在vue-cli生成的目录中,加

最近一直闲来无事,便寻思着做一下自己的个人项目,也想说能使用现在比较流行的一些mvvm框架来做,于是就选用了这样的一个技术栈vue2.0+vue-router+vuex+webpack来做,做得也是多页面应用,使用vue-router,也是想说把多个功能模块化,单个模块spa,实现更高的效果.当然现在还在做的过程中,如果感兴趣可以过来star一下,哈哈,https://github.com/xiaobinwu/Wuji,git clone下来看看. 今天要说的是在做这个项目的过程中,自己想加一个

ceshi.vue <template> <div id="app"> <input type='text' v-model='todo' @keydown="doAdd($event)" /> <button @click="doAdd($event)">+增加</button> <br> <hr> <br> <h2>进行中</h2

用bootstrap封装了个确认框工具 效果如下 代码如下: /** * 以模态窗做确认框的函数,title为标题栏内容,body为消息体,yesFun为点击确认按钮后执行的函数,执行后会执行关闭并删除该模态窗的函数 * 该模态窗只有模态窗 * @param:title:提示标题 * @param:body:提示内容 * @param:yesFun:点击确定后将执行的js函数 */ function modalInit(title, body, yesFun) { var modal = "&l

封装 axios 工具,编辑 src/api/index.js 文件 首先,我们要使用 axios 工具,就必须先安装 axios 工具.执行下面的命令进行安装 npm install axios -D 这样,我们就安装好了 axios 工具了. 新建了一个 src/api/index.js // 配置API接口地址 var root = 'https://cnodejs.org/api/v1' // 引用axios var axios = require('axios') // 自定义判断元素

1.安装 jquery 和 whatwg-fetch (优雅的异步请求API) npm install jquery --save npm install whatwg-fetch --save 2.api接口封装 api/index.js /** * 引入 异步请求API */ import "whatwg-fetch" const host_addr='http://192.168.1.110:8081/' /** * 获取资讯列表 */ export let getList =

一.在实际的开发当中,弹窗是少不了的,默认系统的弹窗样式太丑,难以满足项目的实际需求,所以需要自己定义弹窗组件,把弹窗组价定义为全局的,这样减少每次使用的时候引入麻烦,节省开发时间.本文将分享如何定义一个全局的弹窗组件.下边开始上代码. 二.实际代码如下: 1.在components目录下的public目录新建一个文件夹alert,然后新建两个文件alert.vue和alert.scss.组件的样式代码我喜欢跟组件放到一起,这样按模块去划分管理.公共的样式就放到公共的样式文件里就行了. 2.al

1. 效果图 2. 版本依赖  vue 2.X , elementui  2.0.11  使用element ui  <el-form>标签 3. 源码  components/CityList/index <template> <el-form ref="form" :model="form" label-width="100px"> <el-form-item label="所在地区:&qu

github:  https://github.com/longfei59418888/vui   (记得给一个 start,以后有一起讨论,各种好组件) demo :http://60.205.209.185/#/popup

前言 在做移动端的避免不了 下拉刷新,上拉加载 直接上代码吧,哈哈 组件里: <template lang="html"> <div class="yo-scroll" :class="{'down':(state===0),'up':(state==1),refresh:(state===2),touch:touching}" @touchstart="touchStart($event)" @touchm

最近正在学习Vue2.0相关知识,正好近期饿了么桌面端组件Element-UI发布,便动手做了一款简易个人记账系统,以达到实践及巩固目的. 1.开发环境 Win10 + VS2015 + Sqlserver2008R2 + WebAPI + Dapper + Vue2.0 + Element-UI 2.项目解决方案概览 简单介绍下,Account是WebAPI项目,承载前端请求:Account.BLL.Account.DAL.Account.Entity不废话:Account.Common是对D

一.前端MVC概要 1.1.库与框架的区别 框架是一个软件的半成品,在全局范围内给了大的约束.库是工具,在单点上给我们提供功能.框架是依赖库的.Vue是框架而jQuery则是库. 1.2.AMD与CMD 在传统的非模块化JavaScript开发中有许多问题:命名冲突.文件依赖.跨环境共享模块.性能优化.职责单一.模块的版本管理.jQuery等前端库层出不穷,前端代码日益膨胀 AMD规范及其代表:RequireJS异步模块定义(Asynchronous Module Definition),它是依