实现的方法和逻辑代码注释都有
class Goods {
constructor() {
Goods.list();
}
// 获取商品信息的
// static 静态方法
// 静态方法只属于某个类
static list () {
//发送ajax请求
axios.get('http://localhost/day1012-27/cart2/server/server.php?fn=lst')
.then(res => { //res是后台返回的数据
// console.log(res);
//将数据转化为对象
let { meta, data } = JSON.parse(res);
console.log(meta, data);
//判断服务器状态
let html = '';
if (meta.status == 200) {
//数据是数组对象 取出需要拼接的数据
//需要先循环
data.forEach(ele => {
let { id, goodsName, goodsImg, price } = ele;
html += `<div class="box"><img src="${goodsImg}" alt=""><p>${goodsName}</p><span
class="goods_item_price" data-price-id="100004222715" style="">¥${price}</span><a
href="javascript:" id="InitCartUrl" class="btn-special1 btn-lg" onclick="Goods.addCart(${id},1)">
加入购物车</a></div>`;
})
//追加到页面中去
let cont = document.querySelector('#cont')
cont.innerHTML = html;
}
})
}
//添加购物车的方法
static addCart (id, num) {
console.log(id, num);
//取出local中的数据
let cartGoods = localStorage.getItem('cart');
// console.log(cartGoods);
//2 判断商品是否存在
if (cartGoods) {
cartGoods = JSON.parse(cartGoods);
//2 判断商品是否存在
//循环遍历 for in 遍历对象 这里的attr相当于id
for (let attr in cartGoods) {
if (attr == id) { //2-1商品存在增加数量
num = num + cartGoods[id]; //cartGoods[id] 是当前点击的id id是属性 取的是它的值 num没点一次传输一次 都是1
}//2-2 商品不存在则新增
}
cartGoods[id] = num; //相当于添加一个属性和属性值在 cartGoods对象中
localStorage.setItem('cart', JSON.stringify(cartGoods))
} else {
//3 不存在就新增cart
cartGoods = { [id]: num };
console.log(cartGoods);
//转化为字符串
cartGoods = JSON.stringify(cartGoods);
localStorage.setItem('cart', cartGoods);
}
}
}
new Goods();
PHP部分
<?php
// 执行连接
function con(){
//1 连接
// @ 警告抑制符
$link = @mysqli_connect('127.0.0.1','root','root','test');
// 判断连接状态,连接失败返回false
//var_dump($link)
if(!$link){
die('连接失败...');
}
return $link;
}
// 非查询操作
function query($sql){
// 调用连接的函数
$link = con();
$res = mysqli_query( $link,$sql);
return $res;
}
// 查询操作
function select($sql){
$link = con();
$res = mysqli_query($link,$sql);
//print_r($res);
// 使用while将数据进行遍历
$arr = [];
while($str = mysqli_fetch_assoc($res)){
$arr[] = $str;
}
return $arr;
}
?>
<?php
include('./mysql.php');
$fn = $_GET['fn'];
$fn();
function lst()
{
$id = $_POST['goodsId'];
$id = substr($id,0,strlen($id)-1);
// 一次性获取多条数据
$sql = "select * from product where id in ($id)";
// echo $sql;
$data = select($sql);
echo json_encode([
'meta'=>[
'status'=>200,
'msg'=>'成功'
],
'data'=>$data
]);
}
?>
<?php
include('./mysql.php');
// 获取访问的方法名称
$fn = $_GET['fn'];
// add();
$fn(); // add()
// 查询数据
function lst(){
$sql = 'select * from product';
$res = select($sql);
if($res){
echo json_encode([
"meta"=>[
"status"=>200,
"msg"=>"数据获取成功"
],
"data"=>$res
]);
}
}
?>