uni-app:实现列表单选功能

news2024/9/20 20:47:22

效果图：

核心解析：

一、

<view class="item_all" v-for="(item, index) in info" :key="index">
    <view class='position parameter-info text-over' :class='item.checked?"checked_parameter":""'
					:data-id="item.employee_num" @tap='selectcustomer'>
        <view class="vv_1">{{item.num_name}}</view>
	</view>
</view>

v-for="(item, index) in info"：将数据进行循环展示

:class='item.checked?"checked_parameter":"" ':表示如果当前行的item.checked为真吗，如果为真执行class="checked_parameter"，如果不为真，就执行class="",也就是判断该行数据是否被选中，选中进行颜色更改

:data-id="item.employee_num"：是在uni-app中使用 v-bind 指令将 data-id 属性绑定到 item.employee_num 这个表达式的值。data-id 是一个自定义属性，可以用于存储某个元素的额外数据。也就是绑定一个值，方便在js中引用

@tap='selectcustomer'：点击事件

 二、

info: [{
        employee_num: 1001,
	    employee_name: '张三',
	    checked: false,
	    num_name: '1001-张三'
	},
	{
		employee_num: 1002,
		employee_name: '李四',
		checked: false,
		num_name: '1002-李四'
	}, {
		employee_num: 1003,
		employee_name: '王五',
		checked: false,
		num_name: '1003-王五'
	}, {
		employee_num: 1004,
		employee_name: '赵六',
		checked: false,
		num_name: '1004-赵六'
	}],
parameterList: ''

在data中定义数据

info（也可以设置为空数组，请求服务器端的数据）

parameterList：定义一个字符串，用于存放被选中数据的行信息

三、

// 参数点击响应事件
selectcustomer: function(e) {
    var this_checked = e.currentTarget.dataset.id //获取对应的条目id
	var parameterList = this.info //获取Json数组
	console.log(this_checked)
	for (var i = 0; i < parameterList.length; i++) {
		if (parameterList[i].employee_num == this_checked) {
			parameterList[i].checked = true; //当前点击的位置为true即选中
			this.parameterList = parameterList[i]
			console.log('参数', this.parameterList)
		} else {
			parameterList[i].checked = false; //其他的位置为false
		}
	}
    this.info = parameterList;
},

var this_checked=e.currentTarget.dataset.id:获取被选中行的:data-id中的值(employee_num)

var parameterList = this.info ：获取全部数组的值info

for (var i = 0; i < parameterList.length; i++) :对info的数据进行循环

if (parameterList[i].employee_num == this_checked) :判断info中的每个employee_num是否有与被选中的行的employee_num相等的

parameterList[i].checked = true; ：将满足条件的info数组中的这行数据中的checked 值设置为true,也就表示这行数据被选中

this.parameterList = parameterList[i] ：也就是将data中定义的parameterList的值设置为数组info中的这行数据

parameterList[i].checked = false; ：不满足的行，需要将checked的值设置为false

 this.info = parameterList; ：更新完数据之后重新定义info数组的值

全部代码：

<template>
	<view>
		<view class="top">
			<view class="search">
				<view class="search_in">
					<!-- 使用代码请更改图片路径 -->
					<image :src="search"></image>
					<input type="text" placeholder="请输入名称" placeholder-style="color:#CCCCCC" @confirm="search" />
				</view>
			</view>
		</view>
		<view class="center">
			<view class="pages_name">
				<view class="li"></view>
				<view class="li2">员工信息</view>
			</view>
		</view>
		<view class="all">
			<view class="item_all" v-for="(item, index) in info" :key="index">
				<view class='position parameter-info text-over' :class='item.checked?"checked_parameter":""'
					:data-id="item.employee_num" @tap='selectcustomer'>
					<view class="vv_1">{{item.num_name}}</view>
				</view>
			</view>
		</view>
		<view class="button_sure" @tap="sure">
			<view class="sure_text">确认</view>
		</view>
		<!-- 添加按钮 -->
		<image class='img' :src='add' @tap='add'></image>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				search: getApp().globalData.icon + 'index/search.png',
				add: getApp().globalData.icon + 'index/index/add.png',
				info: [{
						employee_num: 1001,
						employee_name: '张三',
						checked: false,
						num_name: '1001-张三'
					},
					{
						employee_num: 1002,
						employee_name: '李四',
						checked: false,
						num_name: '1002-李四'
					}, {
						employee_num: 1003,
						employee_name: '王五',
						checked: false,
						num_name: '1003-王五'
					}, {
						employee_num: 1004,
						employee_name: '赵六',
						checked: false,
						num_name: '1004-赵六'
					}
				],
				parameterList: ''
			}
		},
		methods: {
			// 参数点击响应事件
			selectcustomer: function(e) {
				var this_checked = e.currentTarget.dataset.id //获取对应的条目id
				var parameterList = this.info //获取Json数组
				console.log(this_checked)
				for (var i = 0; i < parameterList.length; i++) {
					if (parameterList[i].employee_num == this_checked) {
						parameterList[i].checked = true; //当前点击的位置为true即选中
						this.parameterList = parameterList[i]
						console.log('参数', this.parameterList)
					} else {
						parameterList[i].checked = false; //其他的位置为false
					}
				}
				this.info = parameterList;
			},
		},
		// onLoad() {
		// 	uni.request({
		// 		url: getApp().globalData.position + 'Produce/select_employee',
		// 		data: {

		// 		},
		// 		header: {
		// 			"Content-Type": "application/x-www-form-urlencoded"
		// 		},
		// 		method: 'POST',
		// 		dataType: 'json',
		// 		success: res => {
		// 			this.info = res.data.all_info
		// 		},
		// 		fail(res) {
		// 			console.log("查询失败") 
		// 		}
		// 	});
		// }
	}
</script>

<style>
	/* 背景色 */
	page {
		background-color: #F0F4F7;
	}

	/* 搜索框 */
	.search {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 60px;
		background-color: #fff;
		/* border:1px solid black; */
		margin-bottom: 5%;
	}

	.search .search_in {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 20rpx;
		box-sizing: border-box;
		height: 70rpx;
		width: 90%;
		background-color: #F0F4F7;
		border-radius: 5px;
	}

	.search_in image {
		height: 45rpx;
		width: 50rpx;
		margin-right: 10px;
		/* border:1px solid black; */
	}

	.search input {
		/* border:1px solid black; */
		width: 100%;
	}


	/* 列表 */
	.all {
		margin-bottom: 20%;
	}

	.item_all {
		/* border: 1px solid black; */
		margin-bottom: 3%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 100%;
	}

	.position {
		display: flex;
		flex-direction: column;
		justify-content: center;
		height: 80px;
		width: 95%;
		border-radius: 10px;
		background-color: #fff;
		box-shadow: 2px 2px 2px gainsboro;
	}

	.vv_1 {
		margin-left: 5%;
		word-break: break-all;
	}

	/* 选中之后的样式设置 */
	.checked_parameter {
		background: #74bfe7;
		color: #fff;
	}

	.footer button {
		width: 100%;
	}

	/* 标题信息 */
	.center {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 100%;
		margin-bottom: 3%;
	}

	.pages_name {
		/* border: 1px solid black; */
		width: 95%;
		display: flex;
		align-items: center;
	}

	.li {
		/* border: 1px solid black; */
		width: 15px;
		height: 15px;
		border-radius: 100%;
		background-color: #74bfe7;
	}

	.li2 {
		/* border: 1px solid black; */
		font-size: 110%;
		margin-left: 2%;
	}

	/* 悬浮按钮 */
	.img {
		float: right;
		position: fixed;
		bottom: 10%;
		right: 2%;
		width: 100rpx;
		height: 100rpx;
	}

	/* 确认按钮 */
	.button_sure {
		bottom: 0px;
		position: fixed;
		width: 100%;
		height: 8%;
		background: #74bfe7;
		color: white;
		font-size: 105%;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>

扩展：给此界面增加了翻页和模糊查询功能

效果：

前端：

<template>
	<view>
		<view class="top">
			<view class="search">
				<view class="search_in">
					<!-- 使用代码请更改图片路径 -->
					<image :src="search"></image>
					<input type="text" placeholder="请输入员工工号" placeholder-style="color:#CCCCCC" @confirm="search_num" />
				</view>
			</view>
		</view>
		<view class="center">
			<view class="pages_name">
				<view class="li"></view>
				<view class="li2">员工信息</view>
			</view>
		</view>
		<view class="all">
			<view class="item_all" v-for="(item, index) in info" :key="index">
				<view class='position parameter-info text-over' :class='item.checked?"checked_parameter":""'
					:data-id="item.employee_num" @tap='selectcustomer'>
					<view class="vv_1">{{item.num_name}}</view>
				</view>
			</view>
			<view class="pagination">
				<view class="page-button" @tap="prevPage">上一页</view>
				<view class="page-info">{{ page }}</view>
				<view class="page-info">/</view>
				<view class="page-info">{{ totalPage }}</view>
				<view class="page-button" @tap="nextPage">下一页</view>
			</view>
		</view>
		<view class="button_sure" @tap="sure">
			<view class="sure_text">确认</view>
		</view>
		<!-- 添加按钮 -->
		<image class='img' :src='add' @tap='add'></image>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				search: getApp().globalData.icon + 'index/search.png',
				add: getApp().globalData.icon + 'index/index/add.png',
				info: [],
				parameterList: '',
				like_employee_num: '', //模糊查询的员工工号
				page: 1, // 当前页数
				pageSize: 10, // 每页展示的数据条数
				totalPage: 0, //总页数
			}
		},
		methods: {
			// 参数点击响应事件，单选的实现
			selectcustomer: function(e) {
				var this_checked = e.currentTarget.dataset.id //获取对应的条目id
				var List = this.info //获取Json数组
				// console.log(this_checked)
				for (var i = 0; i < List.length; i++) {
					if (List[i].employee_num == this_checked) {
						List[i].checked = true; //当前点击的位置为true即选中
						this.parameterList = List[i]
						console.log('参数', this.parameterList)
					} else {
						List[i].checked = false; //其他的位置为false
					}
				}
				this.info = List;
			},
			//确认
			sure() {
				if (!this.parameterList) {
					uni.showToast({
						title: '请选择员工',
						icon: 'none'
					})
				} else {
					uni.$emit('isRefresh', this.parameterList)
					uni.navigateBack({
						delta: 1
					})
				}
			},
			//模糊查询
			search_num(event) {
                this.page = 1;//模糊查询默认从首页开始
				this.like_employee_num = event.target.value;
				this.getdata()
			},
			getdata() {
				uni.request({
					url: getApp().globalData.position + 'Produce/select_employee',
					data: {
						like_employee_num: this.like_employee_num,
						page: this.page,
						pageSize: this.pageSize
					},
					header: {
						"Content-Type": "application/x-www-form-urlencoded"
					},
					method: 'POST',
					dataType: 'json',
					success: res => {
						this.info = res.data.all_info
						this.totalPage = Math.ceil(res.data.total / this.pageSize);
					},
					fail(res) {
						console.log("查询失败")
					}
				});
			},
			prevPage() {
			  if (this.page > 1) {
			    this.page--;
			    this.getdata();
			  }
			},
			nextPage() {
			  if (this.page < this.totalPage) {
			    this.page++;
			    this.getdata();
			  }
			},

		},
		onLoad() {
			this.getdata();
		}
	}
</script>

<style>
	.pagination {
		display: flex;
		align-items: center;
		justify-content: left;
		margin-bottom: 20%;
		/* border: 1px solid black; */
	}

	.page-button {
		height: 30px;
		line-height: 30px;
		padding: 0 10px;
		border: 1px solid white;
		border-radius: 5px;
		margin: 0 5px;
		cursor: pointer;
	}

	.page-info {
		font-weight: bold;
	}

	/* 背景色 */
	page {
		background-color: #F0F4F7;
	}

	/* 搜索框 */
	.search {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 120rpx;
		background-color: #fff;
		/* border:1px solid black; */
		margin-bottom: 5%;
	}

	.search .search_in {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 20rpx;
		box-sizing: border-box;
		height: 70rpx;
		width: 90%;
		background-color: #F0F4F7;
		border-radius: 10rpx;
	}

	.search_in image {
		height: 45rpx;
		width: 50rpx;
		margin-right: 20rpx;
		/* border:1px solid black; */
	}

	.search input {
		/* border:1px solid black; */
		width: 100%;
	}


	/* 列表 */
	.all {
		margin-bottom: 20%;
		border: 1px solid #F0F4F7;
	}

	.item_all {
		/* border: 1px solid black; */
		margin-bottom: 3%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 100%;
	}

	.position {
		display: flex;
		flex-direction: column;
		justify-content: center;
		height: 160rpx;
		width: 95%;
		border-radius: 20rpx;
		background-color: #fff;
		box-shadow: 4rpx 4rpx 4rpx gainsboro;
	}

	.vv_1 {
		margin-left: 5%;
		word-break: break-all;
	}

	/* 选中之后的样式设置 */
	.checked_parameter {
		background: #74bfe7;
		color: #fff;
	}

	.footer button {
		width: 100%;
	}

	/* 标题信息 */
	.center {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 100%;
		margin-bottom: 3%;
	}

	.pages_name {
		/* border: 1px solid black; */
		width: 95%;
		display: flex;
		align-items: center;
	}

	.li {
		/* border: 1px solid black; */
		width: 30rpx;
		height: 30rpx;
		border-radius: 100%;
		background-color: #74bfe7;
	}

	.li2 {
		/* border: 1px solid black; */
		font-size: 110%;
		margin-left: 2%;
	}

	/* 悬浮按钮 */
	.img {
		float: right;
		position: fixed;
		bottom: 15%;
		right: 2%;
		width: 100rpx;
		height: 100rpx;
	}

	/* 确认按钮 */
	.button_sure {
		bottom: 0rpx;
		position: fixed;
		width: 100%;
		height: 8%;
		background: #74bfe7;
		color: white;
		font-size: 105%;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>

后端：

  //查询员工详细信息
  public function select_employee()
  {
    $like_employee_num = input('post.like_employee_num','');//模糊查询的条件
    $page = input('post.page', 1); // 获取当前页数，默认为第一页
    $pageSize = input('post.pageSize', 10); // 获取每页展示的数据条数，默认为10条
    $start = ($page - 1) * $pageSize; // 计算查询的起始位置
    //计算总页数
    $count = Db::table('hr_employees')->where('employee_num', 'like', '%' . $like_employee_num . '%')->count(); // 查询符合条件的总记录数
    $data['total'] = $count; // 将总记录数返回给前端
    //查询数据
    $data['all_info'] = db::table('hr_employees')->where(['employee_num'=>['like', '%' . $like_employee_num . '%']])->limit($start, $pageSize)->select();
    //处理拼接数据和单选所需数据
    for($i=0;$i<count($data['all_info']);$i++){
         $data['all_info'][$i]['num_name'] =  $data['all_info'][$i]['employee_num'] . '-' . $data['all_info'][$i]['employee_name'];
         $data['all_info'][$i]['checked'] =  false;
    }
    //返回值给前端
    echo json_encode($data);
  }

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/835420.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

【华秋推荐】物联网入门学习模块 ESP8266

【华秋推荐】物联网入门学习模块 ESP8266

随着全球信息技术的不断进步和普及&#xff0c;物联网成为当今备受关注的技术热点之一。通过物理和数字设备之间的连接来实现自动化和互联互通的网络。无线传感器、云计算和大数据分析等技术&#xff0c;物联网使设备能够相互交流和共享信息&#xff0c;实现智能化的自动化操作…
阅读更多...
从k8s 的声明式API 到 GPT的 提示语

从k8s 的声明式API 到 GPT的 提示语

命令式 命令式有时也称为指令式&#xff0c;命令式的场景下&#xff0c;计算机只会机械的完成指定的命令操作&#xff0c;执行的结果就取决于执行的命令是否正确。GPT 之前的人工智能就是这种典型的命令式&#xff0c;通过不断的炼丹&#xff0c;告诉计算机要怎么做&#xff0…
阅读更多...
真的能缓解焦虑和负面情绪的一个技巧——进度条

真的能缓解焦虑和负面情绪的一个技巧——进度条

我之前博客——https://blog.csdn.net/qq_41517071/article/details/129793252 负面情绪原因 当代负面情绪无法及时下线&#xff0c;导致情绪出现帮倒忙的情况。此情况主要由两种原因导致&#xff1a;①无发泄出口。人类社会身不由己&#xff0c;无法找到合适的发泄出口。②…
阅读更多...
【超细节】Vue3组件事件怎么声明，defineEmits与emit

【超细节】Vue3组件事件怎么声明，defineEmits与emit

目录 前言 一、基本语法 1. 子组件触发 2. 父组件监听 二、 事件参数 1. 传值 2. 接收值 三、 事件校验 四、注意事项 前言 组件事件是 Vue 组件之间进行通信的一种方式。它允许一个组件触发一个自定义事件&#xff0c;并且其他组件可以监听并响应这个事件。 一、基本…
阅读更多...
1308. 方程的解(隔板法)

1308. 方程的解(隔板法)

题目链接&#xff1a;https://www.acwing.com/activity/content/problem/content/1761/ 本题需要用高精度 Code #include <cstring> #include <iostream> #include <algorithm>using namespace std;const int N 150;int k, x; int f[1000][100][N];int qm…
阅读更多...
Docker实战-如何去访问Docker仓库？

Docker实战-如何去访问Docker仓库？

导语   仓库在之前的分享中我们介绍过，它主要的作用就是用来存放镜像文件，又可以分为是公共的仓库和私有仓库。有点类似于Maven的中央仓库和公司内部私服。 下面我们就来介绍一下在Docker中如何去访问各种仓库。 Docker Hub 公共镜像仓库 Docker Hub 是Docker官方提供的最…
阅读更多...
基于JAVA SpringBoot和HTML校园二手商城系统设计

基于JAVA SpringBoot和HTML校园二手商城系统设计

随着网络技术的飞跃&#xff0c;人类的社会生活和现代信息技术呈现出不断融合的趋势&#xff0c;生活中的日常账单支付、网上购物、网上学习和娱乐等。二手交易平台应运而生&#xff0c;其主要目的是充分交换人们闲置的产品。你可以在交易平台上发布二手商品&#xff0c;然后有…
阅读更多...
promise中then和catch同时调用

promise中then和catch同时调用

promise同时执行then和catch 之前一直对promise中的then函数和catch有误区&#xff0c;以为resolve就直接走then&#xff0c;reject走catch&#xff0c;但在最近项目中遇到了then和catch同时触发。 下面我们来看一组例子 let count 0const func async () > {countComput…
阅读更多...
CAD中快速加载卫星影像的免费插件

CAD中快速加载卫星影像的免费插件

在对GIS矢量地图数据进行处理的工作中&#xff0c;我们经常会将卫星影像插入到CAD中作为底图&#xff0c;从而便于与矢量地图数据进行叠加对比&#xff0c;但怎样才能将带坐标的卫星影像快速插入到CAD中呢&#xff1f; CAD中卫星影像与矢量数据叠加 这里分享一个可以在CAD中加…
阅读更多...
jacoco多版本报告合并

jacoco多版本报告合并

jacoco提供了一个merge命令可以给我方便的合并代码无变更时的报告&#xff0c;但是一旦代码发生变化&#xff0c;则无法通过jacoco进行直接合并&#xff0c;原因在《jacoco的多次代码提交merge分析》中已经说明&#xff0c;那么针对一次功能测试&#xff0c;势必会进行多轮&…
阅读更多...
【C语言进阶（1）】数据存储

【C语言进阶（1）】数据存储

文章目录 Ⅰ 数据类型介绍⒈类型的基本分类 Ⅱ 整形在内存中的存储⒈原码、反码、补码⒉大小端介绍及判断大小端 Ⅲ 浮点型在内存中的存储⒈浮点数在内存中的存储规则⒉IEEE 754 对 M 和 E 的存取规定⒊解释前面的题目 Ⅰ 数据类型介绍 基本内置类型 类型类型名称char字符数据…
阅读更多...
玄子Share - Mybatis 项目模板使用指南

玄子Share - Mybatis 项目模板使用指南

玄子Share - Mybatis 项目模板使用指南 项目结构图 mybatis-config.xml 配置模板设置 参数 <?xml version"1.0" encoding"UTF-8" ?> <!DOCTYPE configuration PUBLIC "-//mybatis.org//DTD Config 3.0//EN" "https://mybatis.…
阅读更多...
pycharm运行pytest无法实时输出信息

pycharm运行pytest无法实时输出信息

需要去掉控制台输出。根据查询相关信息显示pycharm运行pytest无法实时输出信息&#xff0c;需要去掉pycharm里面的运行模式&#xff0c;点击减号&#xff0c;再点击加号&#xff0c;添加python执行文件即可实时输出信息。 问题描述&#xff1a; 使用pycharm运行代码时&#x…
阅读更多...
24考研数据结构-树与森林

24考研数据结构-树与森林

目录 5.4树、森林5.4.1树的存储结构1. 双亲表示法(顺序存储)&#xff1a;2. 孩子表示法(顺序链式)3. 孩子兄弟表示法&#xff08;链式&#xff09; 5.4.2树、森林与二叉树的转换5.4.3树、森林的遍历1. 树的遍历先根遍历后根遍历层序遍历&#xff08;队列实现&#xff09; 2. 森…
阅读更多...
LeetCode-26-删除有序数组中的重复项

LeetCode-26-删除有序数组中的重复项

一&#xff1a;题目描述&#xff1a; 给你一个 升序排列 的数组 nums &#xff0c;请你 原地 删除重复出现的元素&#xff0c;使每个元素 只出现一次 &#xff0c;返回删除后数组的新长度。元素的 相对顺序 应该保持 一致 。然后返回 nums 中唯一元素的个数。 考虑 nums 的唯…
阅读更多...
AI相机“妙鸭相机”原理分析和手动实现方案

AI相机“妙鸭相机”原理分析和手动实现方案

妙鸭相机 一个通过上传大约20张照片&#xff0c;生成专属自拍。在2023年7月末爆火&#xff0c;根据36Kr报道&#xff0c;妙鸭相机系阿里系产品&#xff0c;挂靠在阿里大文娱体系下&#xff0c;并非独立公司。 使用方法是上传20张自拍照片&#xff0c;之后可以选择模板生成自己…
阅读更多...
神码ai火车头标题伪原创【php源码】

神码ai火车头标题伪原创【php源码】

这篇文章主要介绍了如何把python 代码打包成可执行软件&#xff0c;具有一定借鉴价值&#xff0c;需要的朋友可以参考下。希望大家阅读完这篇文章后大有收获&#xff0c;下面让小编带着大家一起了解一下。 火车头采集ai伪原创插件截图&#xff1a; Python 程序封装-打包成exe程…
阅读更多...
以指标驱动，保险、零售、制造企业开启精益敏捷运营的新范式

以指标驱动，保险、零售、制造企业开启精益敏捷运营的新范式

近日&#xff0c;以“释放数智生产力”为主题的 Kyligence 用户大会在上海前滩香格里拉大酒店成功举行。大会包含上午的主论坛和下午的 4 场平行论坛&#xff0c;并举办了闭门会议、Open Day 等活动。来自金融、零售、制造、医药等行业的客户及合作伙伴带来了超过 23 场主题演讲…
阅读更多...
CSS调色网有哪些

CSS调色网有哪些

本文章转载于湖南五车教育&#xff0c;仅用于学习和讨论&#xff0c;如有侵权请联系 1、https://webgradients.com/ Wbgradients 是一个在线调整渐变色的网站 &#xff0c;可以根据你想要的调整效果&#xff0c;同时支持复制 CSS 代码&#xff0c;可以更好的与开发对接。 Wbg…
阅读更多...
selenium 截屏

selenium 截屏

当前环境&#xff1a; Windows 10 Python 3.7 selenium 3.141.0 Google Chrome 115.0.5790.110 &#xff08;64 位&#xff09; from selenium import webdriver import base64if __name__ __main__:#driver webdriver.Chrome()driver.get(https://www.baidu.com/)# 1.…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023