vue的jsx如何模仿v-if进行条件渲染。

Question

例如在下面代码中的el-button按钮要根据某条件进行渲染时，vue的jsx目前我只晓得可以这么写，但当条件跟按钮一多时，这样写就会显得十分不堪，想请教下大神，jsx中如何写判断语句来决定某标签是否渲染呢？

let a = 1;
if (a === 1) {
    return (
        <div>
            <p>测试</p>
            <el-button>测试</el-button>
        </div>);
} else {
    return (
         <div>
            <p>测试</p>
        </div>);
}

Answer 1

找到答案了，这样写就行了：

let a = 1;
  return (
    <div>
        <p>测试</p>
        {a === 1 ? <el-button>测试</el-button> : ''}
    </div>);

Answer 2

<el-button v-if='test'>测试</el-button>


data（） {
    return{
        test: true//渲染
    }
}

Answer 3

修改了回答...

算了, 建议你还是别折腾.

Answer 4

https://segmentfault.com/a/11...