qq_43036190的博客

uni-app 封装一个进度条组件

移动端 《Clear default style》. 在页面创建base.less 或者base.sass(根据自己的项目用到的预处理器)@charset "utf-8";/*移动端默认样式*//*清除掉按下时会有一个灰色阴影*/a,input,button{ -webkit-tap-highlight-color: rgba(0,0,0,0);}/*清除掉ios自带圆角*/input,button{ -webkit-appearance: none;/*消除输入框核按钮

vue 搜索和添加用户的思路搜索实现思路获取输入框的值（也称关键字）模糊搜索，精确搜索通过事件触发将获取的值通过ajax请求搜索接口传递给后台后台服务器通过服务端语言（node,PHP,Java）实现接收浏览器请求后端语言查询数据库（Mysql,mongodb）将查询的结果根据搜索接口约定好的json格式返回给浏览器通过前端JS将返回的结果渲染展现到页面上性能优化：可以利用防抖或节流，可以减少服务器压力通过 lodash 实现节流或防抖,引入loadash实现防抖，例如：imp

使用element-ui实现步骤条与tab标签页的连动注意 el-tabs 中的 v-model 会自动关联 el-tab-pane 中的 name 值通过 v-model 的变量与el-steps中的active值关联实现联动<template> <div> <!-- 步骤条 --> <el-steps align-center :active="act

在vue中使用element-ui二次封装面包屑导条由于这几天写了一个后台管理系统，多次使用的到了面包屑导航，所以我就把它封装起来使用了；效果图第一步安装element-ui npm i element-ui -S完整引入在 main.js 中写入以下内容：import Vue from 'vue';import ElementUI from 'element-ui';import 'element-ui/lib/theme-chalk/index.css';import A

Vue递归组件实现多级列表分类信息的分类展示数据格式const treeObj = { name: "电子产品", children: [ { name: "电视", children: [ { name: "philips", children: [ { name: "philips-A" }, { name: "philips-B" },

Vue实现鼠标拖拽要实现拖拽，必须要使用三大秘法：（pc端）1、鼠标按下事件：onmousedown2、鼠标移动事件：onmousemove3、鼠标抬起事件：onmouseup移动端拖拽：1、当在屏幕上按下手指时触发：touchstart2、当在屏幕上移动手指时触发：touchmove3、当在屏幕上抬起手指时触发：touchend4、touchcancel 当一些更高级别的事件发生的时候（如电话接入或者弹出信息）会取消当前的touch操作，即触发touchcancel。一般

vue filter的使用过滤器是什么？ 过滤器就是将后台返回的数据换一种形式输出，不改变原来的数据。应用的场景：后台返回状态码 例如（性别，支付状态，时间 ），商品价格过滤器： 有全局过滤器 和 局部过滤器全局过滤器： 全局过滤器必须写在vue实例创建之前。Vue.filter('testfilter', function (value,text) { // 返回处理后的值 return value+text })局部过滤器 局部过滤器必须在组件实例对象里挂载。

Vue的路由懒加载详解什么是路由懒加载？一个字《懒》字如此了的，懒加载就是页面不一次性加载给你所有资源，你什么时候要什么时候给；懒加载也就是延迟加载或者按需加载，即在需要的时候进行加载。在项目中为什么要使用懒加载呢？像vue这种SPA应用，如果没有应用懒加载，运用webpack打包后的文件将会异常的大，造成进入首页时，需要加载的内容过多，时间过长，会出啊先长时间的白屏，即使做了loading也是不利于用户体验，而运用懒加载则可以将页面进行划分，需要的时候加载页面，可以有效的分担首页所承担的加

SVG格式在vue中的使用SVG：svg是一种图像文件格式，它是可缩放的矢量图形，它是基于XML，由World Wide Web Consortium（W3C）联盟进行开发的。严格来说应该是一种开放标准的矢量图形语言，可让你设计激动人心的、高分辨率的Web图形页面。用户可以直接用代码来描绘图像，可以用任何文字处理工具打开SVG图像，通过改变部分代码来使图像具有交互功能，并可以随时插入到HTML中通过浏览器来观看。我们可以在阿里巴巴矢量图标库里面下载[阿里巴巴矢量图标库](https://ww.

vue_4.0版本 手机端开发：如何做适配前端现在的主流适配方案：rem【推荐】,vw,vh,flex布局,百分比，媒体查询rem的适配方案一、lib-flexible：[lexible 的链接] (https://github.com/amfe/lib-flexible)找到github官网然后使用zpi进行解压 只要index.js 和index.min.js|引入你要的vue组件中去amfe-flexibleClassic edition (0.3.2)由于viewport单位得

vuex的概念及安装下载使用Vuex是什么？vuex 是一个专为 Vue.js v应用程序开发的状态管理模式。Vuex背后的基本思想就是我们所说的单向数据流。vuex是一个集中式的存储仓库【状态】，类似于 本地存储、数据库，vuex是vue的状态管理工具，它的功能主要是实现多组件间的状态【数据共享】。什么是状态？用一条数据去管理一个视图或是视图中的一部分，那么我们就将这个数据称之为状...

Vue购物车的小案例案例介绍：这个购物车案例呢4个部分：1、删除选中；2、全选，分选，3、数量影响价格；4、显示所有选中商品总价<template> <div> <table> <tr border='1'> <td> ...

vue中使用 iscroll的方法第一步：先安装scroll的依赖包cnpm install iscroll -s (按下回车键安装)/*下载成功以后是这个样子的*/√ Installed 1 packages√ Linked 0 latest versions√ Run 0 scripts√ All packages installed (used 420ms(network 41...

Vue案例——TodoListvue TodoList案例这个案例主要实现了添加、列表的显示、正在进行、已完成、localstorage本地保存、事项数量的更新、还有清空所有等功能。代码部分如下：HTML部分：<div id="app" v-cloak> <header> <section> ...

vue中使用ref属性进行全选反选功能的实现vue中给我们提供了一种操作DOM的方属性：ref。绑定在DOM元素上的时候，和id差不多，通过（this.$refs来调用）。下面就是就是我用vue写的全选(反选)功能的一个小案例：<style> .ch{ width: 20px; height: 20px; }...