关注
分享
以实战为基础，逐步学习vue&Element
咿呀咿呀哟~~
这个作者很懒，什么都没留下…
展开
-
vue tree-table 实现树形表格
在我们开发电商系统中，通常会有列表展示成tree 的形式，例如以下图片此时, tree-table就可以满足我们的需求 <tree-table class="treeTable" :data="catelist" :columns="columns" :selection-type="false" :expand-type="false" show-index index-text="原创 2021-06-25 09:19:28 · 2499 阅读 · 0 评论 -
vue 实现简单版本 todolist
昨天下午在记事本的功能上做了优化，做成了简单的 todolist，主要是来巩固一下vue的各种指令以下是效果图以上是简单版本的效果图，好啦，献上我的代码~欢迎大家踊跃提出建议<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <m原创 2021-06-24 09:26:02 · 359 阅读 · 0 评论 -
vue 简单指令使用，实现记事本案例
最近公司项目不忙，我终于有时间继续学习vue了，早上看了下官方文档，主要看了下指令，感觉还可以，就上手做了一个小案例，记事本功能。该案列包括以下功能：输入任务按回车键，列表就会新增一条数据输入完任务按回车后输入框将被清空底部有总记录数和清除所有数据鼠标悬浮列表上显示删除按钮可以删除数据一、实现思路1、通过输入框的 @keyup.enter 指令 绑定 添加方法，添加方 法中将输入的内容存到数组中保存2、通过 v-for指令 循环遍历数组元素并在 ul li 中动态显示出来原创 2021-06-23 10:16:30 · 482 阅读 · 0 评论 -
vue + element-ui 实现角色信息功能
上周已更新完用户信息列表以及登录功能，今天抽空将角色信息列表以及角色分配做完了。和小伙伴们分享一下劳动成果，后续会继续更新商品管理的信息~先展示一下效果图这是一个角色列表信息，功能包括新增角色、编辑角色、分配角色点击最左侧展开按钮可以看到角色下面的权限，可以对权限进行删除以及分配权限功能这里是分配权限的页面，通过element-ui 里面的tree进行数据绑定显示好啦，功能已完成，最后献上的代码片段~<template> <div> <!-- 面原创 2021-06-10 14:09:48 · 1230 阅读 · 0 评论 -
vue + Element-UI 实现完整版用户列表以及增删改功能
用户列表已经完全做好，其中包括用户列表查询，数据增删改，以及翻页功能。<template> <div> <!-- 面包屑导航区域--> <el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item> <原创 2021-06-04 17:54:39 · 2732 阅读 · 3 评论 -
vue + Element-UI 实现数据双向绑定
目前在练手做一个后台管理系统，想要实现用户列表页面的显示，可以进行用户查询、分页以及增删改功能，以下是最终效果图：废话不多说，先上代码：通过标签中 v-model 进行数据绑定<template> <div> <!-- 面包屑导航区域--> <el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcrumb-item :to="{ path: '原创 2021-06-02 18:01:13 · 3846 阅读 · 0 评论 -
vue +Element-UI 实现完整的登录退出功能
接着上篇文章开始记录，上篇最后问题已经解决，忘记了 ： 导致的。已修改完成。截至目前为止，登录退出功能已实现，以下是我的代码：Login.vue<template> <div class="login_container"> <div class="login_box"> <!--头部--> <div class="avatar_box"> <img src="../assets/log原创 2021-06-01 13:13:18 · 2324 阅读 · 2 评论 -
小白学习简单的vue + element-ui 实现前端登录页面
一、登录功能业务流程二、登录业务的相关技术点不存在跨域问题，推荐使用cookie与session；反之则使用token，支持跨域三、token 原理分析四、登录功能实现1、布局实现：通过Element-UI组件实现布局el-formel-form-itemel-inputel-button字体图标(iconfont)2、创建新分支git checkout -b login3、vue项目的基本结构。通过vs code 打开项目，删除App.vue中不必要的代码块将原创 2021-05-31 17:51:50 · 1930 阅读 · 0 评论