51dev.com IT技术开发者社区

51dev.com 技术开发者社区

用vue.js实现购物车功能

用vue.js实现购物车功能

购物车是电商必备的功能,可以让用户一次性购买多个商品,常见的购物车实现方式有如下几种:1.用户更新购物车里的商品后,页面自动刷新。2.使用局部刷新功能,服务器端返回整个购物车的页面html3.服务器端返回JSON格式,使用模板引擎+dom操作更新页面最近新学习了vue.js,一个轻量级的mvvm(Model-View-...

vue登录注册实践

vue登录注册实践

步骤一1.安装脚手架:npminstallvue-cli-g2.wepack生成html模版:vueinitwebpack'文件名'3.安装axios、js-cookie、element-ui、stylus等等常用插件步骤二1.在main.js中引入router、element-ui等importVue...

vue-tree 组织架构图/树形图自动生成(含添加、删除、修改)

vue-tree 组织架构图/树形图自动生成(含添加、删除、修改)

项目中用代码生成组织架构图  有新增,编辑,删除的功能    生成树形图的组件git-hub地址: https://github.com/tower1229/Vue-Tree-Chart 这个插件还是很不错的建议把整个安装包下载下来,写成组...

vue+element-ui操作删除(单行和批量删除)

vue+element-ui操作删除(单行和批量删除)

单行删除/批量删除<template><!--表格内容--><el-table:data="packData"borderref="multipleTable"@selection-change="handleSelectionChange"><el-table-columnt...

vue图片点击放大预览v-viewer

vue图片点击放大预览v-viewer

1、安装依赖npminstallv-viewer--save2、局部文件引入importVuefrom‘vue‘;importViewerfrom‘v-viewer‘import‘viewerjs/dist/viewer.css‘Vue.use(Viewer)Viewer.setDefaults({Options:{‘...

vuex实现todoList实例

vuex实现todoList实例

这是一个vuex的项目用例;旨在分割管理项目中的data,以组件为单位,利用vuex提供的module属性,进行项目store的加载管理;最大限度的把逻辑分离出去,让模版文件专一作模版,让 store专心作数据管理。src/store/index.jsimportVuefrom‘vue‘importVuexf...

Vue项目使用CDN优化首屏加载

Vue项目使用CDN优化首屏加载

作为一个网站应用,加载速度是非常重要的。加载速度,一个是程序的合理安排,如以组件按需加载,一个是js、css等资源的异步加载。在Vue项目中,引入到工程中的所有js、css文件,编译时都会被打包进vendor.js,浏览器在加载该文件之后才能开始显示首屏。若是引入的库众多,那么vendor.js文件体积将会相当的大,影...

vue2.0用CKEditor5做自定义图片上传的例子

vue2.0用CKEditor5做自定义图片上传的例子

 因业务需求,要在vue2.0的项目里使用富文本编辑器,经过调研多个编辑器,CKEditor5 支持 vue,遂采用。因CKEditor5 文档比较少,此处记录下引用和一些基本用法。 CKEditor5官网https://ckeditor.com/docs/ckeditor5/l...

vue+element级联选择器对接后台数据

vue+element级联选择器对接后台数据

1.后台接口返回的数据肯定要和级联选择器的数据一致,所以我专门弄个model存放返回的值,如下:/** *@Auther:GGDong*@Date:2019/4/310:30*/@Getter@SetterpublicclassServerList{//值privateStringvalue;//名称priv...

mpvue中使用flyio请求

mpvue中使用flyio请求

1.npm安装 npminstallflyio--save.2.src下新建utils/request.js文件/***Createdbyzhengyi.fuon2018/8/31.*/importFlyfrom‘flyio/dist/npm/wx‘constfly=newFly()consthost=‘ht...

vue前端导出zip包

vue前端导出zip包

1.npminstalljszip /npminstallscript-loader/npminstallfile-saver2.功能代码require(‘script-loader!file-saver‘);importJSZipfrom‘jszip‘exportfunctionexport_txt_to_...

vue实现前端导出excel表格

vue实现前端导出excel表格

1.在src目录下创建一个文件(vendor)进入Blob.js和Export2Excel.js2.npminstall-Sfile-saver 用来生成文件的web应用程序3.npminstall-Sxlsx 电子表格格式的解析器4.npminstall-Dscript-loader 将...

vue回调形成树形结构tree

vue回调形成树形结构tree

//Tree.vue<template><li><span@click="toggle"><iv-if="isFolder"class="el-icon-error":class="[open?‘folder-open‘:‘folder‘]"></i><...

Vue中scoped穿透

Vue中scoped穿透

1stylus的样式穿透使用>>>外层>>>第三方组件样式.wrapper>>>.swiper-pagination-bullet-activebackground:#fffsass和less的样式穿透使用/deep/外层/deep/第三方组件{样式}.wrappe...

vue 解决ie11兼容问题

vue 解决ie11兼容问题

一、ie11打开vue2.0项目空白,控制台报错vuexrequiresaPromisepolyfillinthisbrowserPromise为ES6语法,有的浏览器不支持ES6,所以需要安装babel-polyfill来将ES6转换为浏览器可识别的ES5语法①npminstall--save-devbabel-po...