1.起因 今日看完element中分页器的源码实现,比较简单,遂自己按着理解实现了一个简单的分页器,记录下来,以便日后温习. 2.实现难点 分页器的实现难点主要是什么时候显示分页器的省略, 我的思路是: 规定一个值foldPage, 意为当前最多显示的标签数,当总页数超过即显示省略.省略分为左边省略(folder1)和 右边省略(folder2),布局代码如下: <div class="pagination" @click="pageClick"> &l

在vue中使用Element的message组件 在vue文件中使用 this.$message({ message: "提示信息", type: "success" }) 在js文件中使用 import ElementUI from 'element-ui'; ElementUI.Message({ message: '提示信息', type: 'warning' });

目录 简介 翻版 VS 本尊 后端服务 源码 接下来 简介 这次带来的是FastAPI + vue.js + axios + element ui (一个html文件里使用的) 实现的<Flask Web开发实战_入门.进阶与原理解析(李辉著 )> 中的实战项目SayHello 翻版 VS 本尊 本尊sayhello- flask :: Demo- | http://sayhello.helloflask.com/ 俺的翻版sayhello-fastapi:: Demo 暂时只上线了后端服务

一.搭建好项目的环境. 二.根据ElementUI官网的自定义主题(http://element.eleme.io/#/zh-CN/component/custom-theme)来安装[主题生成工具]. 三.在 element-variables.scss 文件里修改 $–color-primary:#409EFF,即你想要的主题颜色.然后,执行主题编译命令生成主题(et),根目录会生成一个theme文件夹. 四.封装动态换肤色ThemePicker.vue组件. <template> <

前提工作-安装并配置好以下环境: 1.安装node  2.安装git 1.初始化项目 vue init webpack vue-elementui npm run dev 2.安装element npm i element-ui -S 3.引入element 3.1:在main.js中引入elementUI import ElementUI from 'element-ui' import 'element-ui/lib/theme-chalk/index.css' Vue.use(Elemen

错误: vue.js:634 [Vue warn]: Unknown custom element: <ve-pie> - did you register the component correctly? For recursive components, make sure to provide the "name" option. 原因:引用了插件,却没有在main.js里使用. 解决方法:先把对应的插件import进来,在加上Vue.use(...); .比如这里是

1,安装element     :      vue add element 2,安装路由          :     vue add router 3,创建路由的过程  :   (1) 新建 vue页面 main.vue , (2)在router.js 文件中引入和注册  , (3)前台引入   <router-link to="/main">Main</router-link> 4, 安装 axios ( 处理接口请求 )  : cnpm i axios

iview与element都是与vue配合使用的ui框架,用法与配置基本一致,在此,我以iview为例,教你如何起步.*首先,你需要有一定的vue基础,如果你还是个小白,可以去我之前介绍如何搭建一个vue项目先看看,点击下面的链接就OK了http://www.jianshu.com/p/866999e513efvue.js使用vue-cli搭建... 1.安装 安装:方式有俩种 [1]:CDN 引入 <!-- 引入css样式 --> <link rel="stylesheet&

源码地址:https://gitee.com/liuge1988/kitty 软件架构 后端架构 开发环境 IDE : eclipse 4.x JDK : JDK1.8.x Maven : Maven 3.5.x MySQL: MySQL 5.7.x 技术选型 核心框架:Spring Boot 2.x 服务治理:Spring Cloud Finchley 安全框架:Spring Security 5.x 视图框架:Spring MVC 5.x 持久层框架:MyBatis 3.x 数据库连接池:D

因为在element 中表格是使用el-table的形式通过数据来支撑结构,所以,表格的样式没有自己写的灵活,所以有了没法添加按钮的烦恼.下面是解决的方法. 准备工作: 一.下载npm安装包两个 1.npm install --save xlsx file-saver 二.在要下载表格的页面引入依赖 1.    import FileSaver from 'file-saver' 2.   import XLSX from 'xlsx' 三.在页面中利用element 添加表格,并在表头中具体要

最近使用到element ui的下拉多选框Checkbox Checkbox用法可参考与于 http://element.eleme.io/#/zh-CN/component/checkbox Checkbox的属性和事件如下图: 在框架中的搜索组件中需要获取选中的值,因此使用Checkbox自带的 change 事件 基础使用如下: 页面代码: <el-checkbox  @change="handleChange">example</el-checkbox>

在使用element的上传组件时在一下几个钩子中传递其他参数 图中是文件上传时的几个钩子,参数为文件或文件列表或者其他参数,但是现在我想在原有参数上传递其他参数.比如我想在on-success的钩子中传递一个自定义参数i,原本是这样写的: :on-success=”handleSuccess(i)” //handleSuccess是一个方法 但是发现这样写取不到自身原来的参数,后来在网上找到了一个比较好的方法,如下: :on-success=”(value)=> handleSuccess(i,

前提:题主之前只是随意的封装,项目统一ui,然后只实现了父组件拿子组件值,没有实现父组件修改子组件的值,仔细看了文档才知道用model的作用,直接上代码 Vue.component("base-input", { model: { prop: "val", event: "input" }, props: { val: [String, Number] }, template: ` <input type="text"

最近准备写一个echarts的可视化展示案例,首先用vue-cli3创建了一个项目(好像vue-cli4也出来,感觉变化不大,就没升级了) 然后,开始配置路由↓下面是我的router.js文件 import Vue from "vue"; import VueRouter from "vue-router"; import Home from "@/views/main/index.vue"; Vue.use(VueRouter); const

记一个卡了我比较久的问题,之前弄的心态爆炸各种问题. 现在来记录一下,首先我vant是已经安装成功了的. 然后引入element ui npm i element-ui -S 接着按需引入,安装插件 npm install babel-plugin-component -D 修改babelrc的信息 然后他报错Error: Couldn't find preset "es2015" relative to directory "D:\\mall" 引入这个即可 np

公司做的一个后台系统,由于Elemen ui是响应式的,在小屏笔记本中,一行两列的表单会自动变成一行一列,这样就很不美观了,由于是后台系统,当时也没考虑适配问题. 老总 地表最强的电脑 运行了一下,当场就被他叼了. 最后只能回去做适配了,但是发现修改了样式之后,怎么也没效果. 千般百度后,发现了这个东东~ <style lang="scss" scoped> 也就是scoped这个东西...让我搞了半个小时. scoped的作用:在style标签上添加scoped属性,以表

1.安装 npm install element-china-area-data -S 2.使用(引入) import { provinceAndCityData, regionData, provinceAndCityDataPlus, regionDataPlus, CodeToText, TextToCode } from ‘element-china-area-data‘ 说明: provinceAndCityData是省市二级联动数据(不带“全部”选项) regionData是省市区三

首先附上源码地址 https://files.cnblogs.com/files/maruihua/vue-tagsinput-master.zip 这个是我修改后的代码.取消了部分功能,添加的一些功能,原插件在以下网址,有兴趣的可以去看一看 https://github.com/voerro/vue-tagsinput 具体怎么使用呢 <template> <div> <span>inputtags</span> <tagsinput><

在css样式表里面加入一个背景样式background:#FFFFFF ! important

封装组件代码 // 组件:树 /* 参数说明-属性: 1.treeData:展示数据(array) 2.treeEmptyText:内容为空的时候展示的文本(String) 3.treeNodeKey:每个树节点用来作为唯一标识的属性,整棵树应该是唯一的(String) 4.treeRenderAfterExpand:是否在第一次展开某个树节点后才渲染其子节点(boolean) 5.treeHighlightCurrent:是否高亮当前选中节点,默认值是 false(boolean) 6.tre