利用Vue+Element-ui实现简单的增删改功能

最新推荐文章于 2023-05-14 21:33:34 发布

Violet丶Evergarden

最新推荐文章于 2023-05-14 21:33:34 发布

阅读量1k

点赞数

本文链接：https://blog.csdn.net/Vollerei/article/details/103324357

版权

HTML部分

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
	<link rel="stylesheet" type="text/css" href="style/test.css">
</head>
<body>
	<div id = "app">
		<div class="head">
			<el-row :gutter="20">
				<el-col :span="6">
					<el-input v-model="userInfo.name" placeholder="请输入姓名"></el-input>
				</el-col>
				<el-col :span="6">
					<el-input v-model="userInfo.gender" placeholder="请输入性别"></el-input>
				</el-col>
				<el-col :span="6">
					<el-input v-model="userInfo.phoneNum" placeholder="请输入电话号码"></el-input>
				</el-col>
				<el-col :span="6">
					<el-date-picker
				    v-model="userInfo.birthday"
				    type="date"
				    format="yyyy 年 MM 月 dd 日"
      				value-format="yyyy-MM-dd"
				    placeholder="选择生日">
				    </el-date-picker>
				</el-col>
			</el-row>
			<el-button type="primary" @click="addUser" class="add-btn">添加信息</el-button&g

最低0.47元/天解锁文章

Violet丶Evergarden

关注

0
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
利用Vue+Element-ui实现简单的增删改功能

HTML部分<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/th...
复制链接

扫一扫