首页
友链
壁纸
留言
今日热榜
更多
关于
时光
推荐
精品流量卡
Search
1
都二十多年了,你的梦为什么还没碎!
57,051 阅读
2
2022年5个好用的 BT/ 磁力链接下载工具推荐 |Windows 、安卓系统
37,156 阅读
3
nps内网穿透实现外网访问树莓派
32,370 阅读
4
实践利用宝塔建emlog个人博客-超详细【原创】
26,116 阅读
5
Typecho-Joe-Theme主题帮助文档
24,518 阅读
闲杂乱码
Python
网站源码
微信小程序
娱乐分享
Is相册
软件工具
登录
Search
标签搜索
PHP
HTML
API
Javascript
源码
JS
Vue
Github
CloudFlare
接口
函数
SQL
ASP.NET
MVC
EF
T4模板
后台管理
CDN
微信小程序
MAC
韩小韩
累计撰写
261
篇文章
累计收到
1,296
条评论
首页
栏目
闲杂乱码
Python
网站源码
微信小程序
娱乐分享
Is相册
软件工具
页面
友链
壁纸
留言
今日热榜
关于
时光
推荐
精品流量卡
搜索到
2
篇与
Element
的结果
2022-07-04
Vue项目element组件遇到的坑(记录篇持续更新)
Input数字输入框<!-- 一般情况使用 type="number"存在问题:数字可为负数,且出现上增下减箭头 --> <el-input v-model="input" placeholder="请输入内容" type="number"></el-input> <!-- 我的解决方案 - Perfect --> <el-input v-model="input" placeholder="请输入内容" oninput="value=value.replace(/[^0-9]/g,'')"></el-input>JS校验判断姓名const reg = /^[\u4e00-\u9fa5]{2,8}$/; const name = '呜哈哈1'; console.log(`姓名校验 ${reg.test(name)?'正确':'错误'}`);JS校验判断手机号const reg = /^1[3|4|5|7|8]\d{9}$/; const mobil = '1525222222'; console.log(`手机号校验 ${reg.test(mobil)?'正确':'错误'}`);JS校验判断身份证号码const reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/; const userNum = '320333199806060011X'; console.log(`身份证号码校验 ${reg.test(userNum)?'正确':'错误'}`);
2022年07月04日
489 阅读
2 评论
2 点赞
2022-01-14
Vue项目Element-UI表格el-table的分页el-pagination功能简单封装
{message type="success" content="自用笔记"/}表格代码 Table.vue<!-- * @Author: Han * @Date: 2022-01-13 14:00:49 * @LastEditors: Han * @LastEditTime: 2022-01-14 14:22:15 --> <template> <section class="content"> <div class="theTable"> <el-table :data="tableData" border :header-cell-style="{background:'#f5f7fa'}"> <el-table-column type="index" label="序号" header-align="center" align="center" width="50"> </el-table-column> <el-table-column prop="userId" label="用户ID" header-align="center" align="center" width="146"> </el-table-column> <el-table-column prop="userName" label="姓名" header-align="center" align="center"> </el-table-column> <el-table-column prop="mobile" label="用户账号" header-align="center" align="center" width="146"> </el-table-column> <el-table-column label="用户类别" header-align="center" align="center"> <template slot-scope="scope"> <span>{{scope.row.userType=='TEACHER'?'教师':'学生'}}</span> </template> </el-table-column> <el-table-column prop="schoolName" label="学校名称" header-align="center" align="center"> </el-table-column> <el-table-column label="操作" header-align="center"> <template slot-scope="scope"> <div class="caozuo"> <span @click="setDIALOG(true,scope.row)">{{scope.row.status=='DISABLED' ?'启用':'禁用'}}</span> </div> </template> </el-table-column> </el-table> </div> <Paging :pageData="pageData" @pageSizeChan="pageSizeChan" /> </section> </template> <script> export default { components: { Paging: () => import('@/components/Paging') }, data() { return { tableData: [], pageData: { thepageSize: 10, pageIndex: 1, dataTotal: 0 } } }, methods: { // 分页功能 pageSizeChan(pg) { this.pageData.pageIndex = pg this.数据请求函数() }, } } </script>分页组件代码 Paging.vue<!-- * @Author: Han * @Date: 2022-01-13 14:24:52 * @LastEditors: Han * @LastEditTime: 2022-01-13 14:25:17 --> <template> <div class="thePage" v-if="pageData.dataTotal > 0"> <span>第{{pageData.pageIndex}}页/{{pageData.dataTotal}}条数据</span> <el-pagination background @current-change="pageChange" :page-size="pageData.thepageSize" :current-page="pageData.pageIndex" layout="prev, pager, next, jumper" :total="pageData.dataTotal"> </el-pagination> </div> </template> <script> export default { props: { pageData: { type: Object, default: null } }, methods: { // 换页功能 pageChange(nowPage) { this.$emit('pageSizeChan', nowPage) } } } </script> <style> .thePage { display: flex; align-items: center; float: right; padding: 24px 0 24px; font-size: 14px; } </style>
2022年01月14日
505 阅读
0 评论
0 点赞