如何在render中循环(3)

简介: 如何在render中循环(3)

如何在render函数中循环,实现以下代码


<ul>
      <li>青椒炒肉丝 </li>
      <li>西红柿炒肉丝 </li>
      <li>蘑菇炒肉丝 </li>
    </ul>


在render中实现循环


export default{
    data(){
        return{
            isRed:true,
            arr:["青椒炒肉丝","西红柿炒肉丝","蘑菇炒肉丝"],
            inputValue:""
        }
    },
    //  h 最终创建的是一个元素
    // 第一个参数div  是表示创建一个div区域的元素
    // 第二个参数class表示的是这个div上有一个属性
    // 第三个参数可以是数组,表示div元素下的子元素
    render(h){
        return h('ul',
        // 第三个参数
        this.arr.map(item=>h("li",item))
       );
    }
}



1425695-20200305225826056-976686797.png

相关文章
|
1月前
|
JavaScript
Vue 循环渲染 v-for
Vue 循环渲染 v-for
|
1月前
|
JavaScript 前端开发
JS——while 循环和 do while 循环:究竟有什么区别?
JS——while 循环和 do while 循环:究竟有什么区别?
30 1
|
1月前
|
JavaScript 前端开发 索引
Vue嵌套循环渲染与条件渲染--v-for|v-if
Vue嵌套循环渲染与条件渲染--v-for|v-if
24 0
|
1月前
|
JavaScript
03. Vue3 中的条件判断与循环
03. Vue3 中的条件判断与循环
18 0
|
1月前
|
JavaScript 前端开发
js中的while循环和do while循环的区别
js中的while循环和do while循环的区别
24 8
|
1月前
|
JavaScript
Vue3 循环渲染 v-for
Vue3 循环渲染 v-for
|
7月前
|
JSON JavaScript 前端开发
Vue 列表渲染 v-for循环
Vue 列表渲染 v-for循环
27 0
|
10月前
jsx种map循环中使用if判断
jsx种map循环中使用if判断
57 0
|
1月前
|
JavaScript
原生js实现for循环占位符绑定数据,类似模拟vue循环渲染数据
原生js实现for循环占位符绑定数据,类似模拟vue循环渲染数据
|
8月前
|
存储 JavaScript 前端开发
JS的for循环,forin循环,forof循环,foreach循环map循环以及,reduce()循环 方法最实用详解。
JS的for循环,forin循环,forof循环,foreach循环map循环以及,reduce()循环 方法最实用详解。

热门文章

最新文章