前端渲染fetch获取的数据问题?
问题描述:
我使用了fetch方法向后端发送了一个请求,获取到了返回数据之后
,该数据是一个对象类型的,我如何批量创建li到该ul中呢?li中要对应对象的属性
后端数据格式
{ "code": 200, "data": [ "info", "true" ], "message": "\u6210\u529f" }
第 1 个答案:
data对象,你是想获取data.data那个数组,再按数组元素一个个生成li吧。
这里的话,批量创建li到ul,有三种方式:
- 每创建一个li就append到ul
const data = ['info', 'data']; for (let i = 0; i < data.length; i++) { const li = document.createElement('li'); li.textContent = `${data[i]}`; document.getElementById('soft').appendChild(li); }
- 1的优化版:fragment
const data = ['info', 'data']; const fragment = document.createDocumentFragment(); for (let i = 0; i < data.length; i++) { const li = document.createElement('li'); li.textContent = `${data[i]}`; fragment.appendChild(li); } document.getElementById('soft').appendChild(fragment);
- 直接用innerHTML
直接组装好字符串<li>1</li><li>2</li>
然后赋值到ul的innerHTML
const data = ['info', 'data']; document.getElementById('soft').innerHTML = data.map(item=>'<li>'+item+'</li>').join('');
在自定义的模态框组件的插槽中,无法与a-radio-group组件进行双向绑定。但是用antd的a-mod ...