【详细教程制作】用户列表

在这里插入图片描述

👨‍💻个人主页：@开发者-曼亿点

👨‍💻 hallo 欢迎点赞👍 收藏⭐ 留言📝 加关注✅!

👨‍💻 本文由曼亿点原创

👨‍💻 收录于专栏：PHP程序开发

⭐🅰⭐

— 请添加图片描述

文章目录

- ⭐🅰⭐
- ⭐前言⭐
- 🎶（1）构建静态用户列表
- 🎶（2）循环生成用户列表
- - - 结束语🥇

⭐前言⭐

构建静态用户列表通常涉及收集和组织用户信息，以便后续分析或使用。以下是一些构建静态用户列表的步骤：

1.确定收集的信息：确定需要收集的用户信息，例如姓名、年龄、性别、电子邮件地址、联系方式等。根据项目需求，可能还需要收集其他信息，如地理位置、兴趣爱好、购买历史等。

2.选择数据存储方式：选择适当的数据存储方式，例如使用电子表格、数据库或专门的用户管理系统。确保所选的存储方式能够满足数据存储和管理的需求，并且符合相关的数据隐私和安全法规。

3.收集用户信息：通过各种途径收集用户信息，例如在线注册表单、调查问卷、购买流程等。确保在收集用户信息时遵循隐私政策，并获得用户的明确同意。

4.整理和清洗数据：对收集到的用户信息进行整理和清洗，确保数据的准确性和一致性。删除重复或无效的条目，并对数据进行格式化和标准化，以便后续分析和使用。

5.建立用户档案：为每个用户创建一个独立的档案，包含其提供的所有信息。根据需要，可以为用户档案添加其他属性或标签，以便更好地描述和分类用户。

6.管理和更新用户信息：定期更新用户信息，确保数据的及时性和准确性。根据用户的行为或反馈更新其档案，并及时处理用户的请求或更新。

7.保护用户隐私：确保用户信息的安全和隐私，采取适当的措施保护用户数据不被未经授权的访问或滥用。遵守相关的数据保护法律和法规，保护用户的权利和利益。

🎶（1）构建静态用户列表

打开 https://weui.io/#list 可以查看列表组件list的效果，如图下图所示。这里选择【带图标、说明、跳转的列表项】组件作为显示联系人的样式。新建html文件使用weUI中的List组件构建用户列表。读者也可以直接拷贝资源中的index.html页面重新命名。

🦖【表单html】代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
		<link rel="stylesheet" href="css/weui.css"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>实战训练</title>
</head>
<body>
	<div class="weui-panel">
	            <div class="weui-panel__hd">用户列表</div>
	            <div class="weui-panel__bd">
	                <div class="weui-media-box weui-media-box_small-appmsg">
	                    <div class="weui-cells">
						
							<a aria-labelledby="t1 t2" class="weui-cell weui-cell_active weui-cell_access weui-cell_example" href="javascript:">
							        <div aria-hidden="true" id="t1" class="weui-cell__hd"><img  style="width: 50px; height: 50px;" src="img/<?php echo $i+1 ?>.jpg" alt=""></div>
							        <div aria-hidden="true" id="t2" class="weui-cell__bd weui-cell_primary">
							            <p>张三</p>
							        </div>
							        <div class="weui-cell__ft"><span>11111<span></div>
							    </a>
							</div>
	            </div>
	        </div>
		</div>
</body>
</html>

运行结构如下：
在这里插入图片描述

🎶（2）循环生成用户列表

将上面的html文件，重新命名为php文件，由于显示的用户组件如下：

<div class=weui-cell weui-cell_active weui-cell_access ">
...
</div>

因此只需在上面络组件中插入php循环结构即可

🐛【循环用户列表】php代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
	<link rel="stylesheet" href="css/weui.css"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<form method="get" action="users.php">
<div class="weui-panel">
            <div class="weui-panel__hd">用户列表</div>
            <div class="weui-panel__bd">
                <div class="weui-media-box weui-media-box_small-appmsg">
                    <div class="weui-cells">
					<?php
					$names=array('张三','李四','王五','麻溜','七七');
					$number1=array(11111,22222,33333,44444,55555);
					$num=5;
					for($i=0;$i<5;$i++){
						?>
						<a aria-labelledby="t1 t2" class="weui-cell weui-cell_active weui-cell_access weui-cell_example" href="javascript:">
						        <div aria-hidden="true" id="t1" class="weui-cell__hd"><img  style="width: 50px; height: 50px;" src="img/<?php echo $i+1 ?>.jpg" alt=""></div>
						        <div aria-hidden="true" id="t2" class="weui-cell__bd weui-cell_primary">
						            <p><?php echo $names[$i];?></p>
						        </div>
						        <div class="weui-cell__ft"><span><?php echo $number1[$i];?><span></div>
						    </a>
						</div>
						<?php
					}
					?>
                </div>
            </div>
        </div>
	</div>
	</form>
</body>
</html>

🦖 运行结果的显示：
在这里插入图片描述
(常见错误)
①for(表达式)或者 whie(条件)后面添加“;”号，导致循环无效;
②循环没有结束条件,一直执行的循环(死循环)将导致程序崩溃。