vue如何在render函数中使用判断(2)

你。 提交于 2020-03-05 23:24:30

在render函数中使用判断可以提高 页面的多样性

// 这是render函数的使用方法
export default{
    data(){
        return{
            isRed:true,
            arr:[1,2,3,4],
            inputValue:""
        }
    },
    //  h 最终创建的是一个元素
    // 第一个参数div  是表示创建一个div区域的元素
    // 第二个参数class表示的是这个div上有一个属性
    // 第三个参数可以是数组,表示div元素下的子元素
    render(h){
        // 在render函数中进行判断
        if (this.isRed==true){
            return h('div', {
                //第二个参数
                class: {
                    'is-red': this.isRed
                }
            },
            // 第三个参数
            [h('p', '这是一个render  true')]);
        }else{
            return h('div', {
                //第二个参数
                class: {
                    'is-red': this.isRed
                }
            },
            // 第三个参数
            [h('p', '我也是render函数isRed的值是false')]);
        }
    }
}

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!