08_数组排序

本题考点：点击事件、排序、模板字符串

根据题目要求，当点击”销量升序“时，列表内容按照销量升序重新渲染。点击”销量降序“时反之。核心步骤有：

1. 创建重渲染函数，每当数组项顺序发生改变时触发该函数。该函数接收一个数组参数，函数内创建一个空字符串用于保存HTML模板，遍历数组项创建HTML模板并且拼接在空字符串之后，最终将字符串中的HTML模板值给ul的innerTHML
2. 给”销量升序“和”销量降序“绑定点击事件，分别按照"升序"、"降序"排列数组再调用重渲染函数

参考答案：

const _listRendering = arr => {
    var str = ''
    arr.forEach(element => {
    	str += `<li>${element.name}</li>`
    })
    ul.innerHTML = str
}
upbtn.onclick = function () {
    var upArr = cups.sort(function (a, b) {
    	return a.sales - b.sales
    })
    _listRendering(upArr)
}
downbtn.onclick = function () {
    var downArr = cups.sort(function (a, b) {
    	return b.sales - a.sales
    })
    _listRendering(downArr)
}