点击进入 :https://donlex.cn/archives/5def7cdc.html
创建基本文件
在html
文件中引入css和js文件,参考网站的教程,使用相应的标签,这里做了一个简单的带有查询功能的表格。
效果如下:
上面的Gif中,在表格中的时间一列,使用了过滤器,将new Date()
得到的时间转化为yyyy-mm-dd
。
实现代码:
<!DOCTYPE html>
<html>
<head>
<title>vue-test2</title>
<!-- 引入样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
</head>
<body>
<div id="app">
<h2>信息管理</h2>
<el-form :inline="true">
<el-form-item label="搜索">
<el-input v-model.trim="search"></el-input>
</el-form-item>
<!-- <el-button type="primary" icon="el-icon-search" @click="handlesearch"></el-button> -->
</el-form>
<el-form :inline="true">
<el-form-item label="姓名">
<el-input v-model.trim="name" type="text" placeholder="请输入姓名"></el-input>