展示收获地址

展示收获地址

1.持久层

1.1sql语句设计

select * from t_address where uid = ?

1.2设计接口

List<Address> findAddressByUidAddresses(Integer uid);

因为uid里面有好多地址要用一个集合

1.3编写方法

<select id="findAddressByUidAddresses" resultType="com.cy.store.entity.Address">
    select * from t_address where uid=#{uid}
</select>
​

1.4测试

2.业务层

2.1规划异常

无

2.2设计接口

List<Address> getByUid(Integer uid);

2.3编写方法

@Override
public List<Address> getByUid(Integer uid) {
​
    List<Address> list = addressMapper.findAddressByUidAddresses(uid);
​
    return list;
​
}

3.控制层

3.1 处理异常

说明：无异常。

3.2 设计请求

设计用户提交的请求，并设计响应的方式。

请求路径：/addresses
请求参数：HttpSession session
请求类型：GET
响应结果：JsonResult<List<Address>>

3.3 处理请求

1.在AddressController类中添加处理请求的getByUid(HttpSession session)方法。

@GetMapping({"", "/"})
public JsonResult<List<Address>> getByUid(HttpSession session) {
    Integer uid = getUidFromSession(session);
    List<Address> data = addressService.getByUid(uid);
    return new JsonResult<>(OK, data);
}

2.完成后启动项目，打开浏览器先登录，再访问http://localhost:8080/addresses页面。

4.前端页面

1.在address.html页面中body标签内部的最后，添加展示用户收货地址列表数据的JavaScript代码。

<script type="text/javascript">
$(document).ready(function () {
    showAddressList();
});
​
function showAddressList() {
    $("#address-list").empty();
    $.ajax({
        url: "/addresses",
        type: "GET",
        dataType: "JSON",
        success: function (json) {
            let list = json.data;
            for (let i = 0; i < list.length; i++) {
                console.log(list[i].name);
                let address = '<tr>'
                    + '<td>#{tag}</td>'
                    + '<td>#{name}</td>'
                    + '<td>#{province}#{city}#{area}#{address}</td>'
                    + '<td>#{phone}</td>'
                    + '<td><a class="btn btn-xs btn-info"><span class="fa fa-edit"></span> 修改</a></td>'
                    + '<td><a class="btn btn-xs add-del btn-info"><span class="fa fa-trash-o"></span> 删除</a></td>'
                    + '<td><a class="btn btn-xs add-def btn-default">设为默认</a></td>'
                + '</tr>';
​
                address = address.replace(/#{aid}/g, list[i].aid);
                address = address.replace(/#{tag}/g, list[i].tag);
                address = address.replace("#{name}", list[i].name);
                address = address.replace("#{province}", list[i].provinceName);
                address = address.replace("#{city}", list[i].cityName);
                address = address.replace("#{area}", list[i].areaName);
                address = address.replace("#{address}", list[i].address);
                address = address.replace("#{phone}", list[i].phone);
​
                $("#address-list").append(address);
            }
            $(".add-def:eq(0)").hide();
        }
    });
}
</script>

2.完成后启动项目，打开浏览器先登录，再访问http://localhost:8080/web/address.html页面。

标签：getByUid,uid,展示,List,收获,list,replace,地址,address
来源： https://www.cnblogs.com/shuangshuangzi/p/16142986.html