Développé avec PHP et Vue : Enquête sur les enregistrements d'échange de points de membre
Introduction :
Dans les plateformes de commerce électronique ou les systèmes d'adhésion, les points sont un mécanisme de récompense courant. Les membres gagnent des points grâce à leur consommation, puis utilisent ces points pour échanger des biens. . ou des services. Afin de faciliter la gestion des membres et de promouvoir leur activité, il est nécessaire d'interroger les enregistrements d'échange de points des membres. Cet article utilisera le développement PHP et Vue comme exemple pour présenter en détail comment implémenter la fonction de requête d'enregistrement d'échange de points membres et fournira des exemples de code spécifiques.
1. Préparation du projet
Avant de commencer le développement, vous devez confirmer les éléments suivants :
Créez un fichier appelé "exchangeRecords.php" et assurez-vous d'importer la configuration de connexion à la base de données.
// Interroger les enregistrements d'échange de points des membres
function getExchangeRecords($member_id) {
// 创建数据库连接
$conn = new mysqli(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME);
// 检查连接是否成功
if ($conn->connect_error) {
die("连接数据库失败：" . $conn->connect_error);
}
// 构建查询语句
$sql = "SELECT * FROM exchange_records WHERE member_id = '$member_id'";
// 执行查询
$result = $conn->query($sql);
// 检查查询结果是否为空
if ($result->num_rows > 0) {
// 将查询结果转换为数组
$rows = array();
while ($row = $result->fetch_assoc()) {
$rows[] = $row;
}
return $rows;
} else {
return "没有找到会员积分兑换记录";
}
// 关闭数据库连接
$conn->close();
// Traiter les demandes
// 获取会员ID $member_id = $_GET["member_id"]; // 调用查询函数，返回结果 $result = getExchangeRecords($member_id); // 返回查询结果 echo json_encode($result);
?>
Créez un fichier nommé "config.php", contenant les informations de configuration de la base de données.
define('DB_PASSWORD', 'password');
definition('DB_NAME', 'your_database_name');
?>
4. Développement front-end
Vue.use(VueRouter)
const router = new VueRouter({
{
path: '/',
name: 'Home',
component: Home
},
// 其他路由配置...})
new Vue({
render: h => h(App)
}).$mount ("#app")
Créez un composant de page nommé "ExchangeRecords.vue". La page contient une zone de saisie et un bouton pour saisir l'ID du membre et déclencher la requête.
<input type="text" v-model="memberId" placeholder="请输入会员ID" />
<button @click="getExchangeRecords">查询</button>
<table>
<thead>
<tr>
<th>记录ID</th>
<th>会员ID</th>
<th>兑换日期</th>
<th>兑换积分</th>
<th>兑换商品</th>
</tr>
</thead>
<tbody>
<tr v-for="record in exchangeRecords" :key="record.id">
<td>{{ record.id }}</td>
<td>{{ record.member_id }}</td>
<td>{{ record.exchange_date }}</td>
<td>{{ record.exchange_points }}</td>
<td>{{ record.exchange_goods }}</td>
</tr>
</tbody>
</table>
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
