将 Blade If Else 转换为 Vue If Else

Posted 2023-03-14

【中文标题】将 Blade If Else 转换为 Vue If Else

【英文标题】：Convert Blade If Else to Vue If Else

【发布时间】：2021-08-30 19:57:02

【问题描述】：

我在 Blade 中有一个 if else 条件，我想将其转换为 Vue if else

@if (Auth::user()->avatar != null)
    <img src=" URL::to('storage/app/public') . '/' . Auth::user()->avatar "
        class="img-circle elevation-2" >
@endif
@if (Auth::user()->avatar == null)
    @if (Auth::user()->gender == 'Male')
        <img src=" URL::asset('public/bower_components/admin-lte/dist/img/fb-male.jpg') "
            class="img-circle elevation-2" >
    @else
        <img src=" URL::asset('public/bower_components/admin-lte/dist/img/female-fb.jpg') "
            class="img-circle elevation-2" >
    @endif
@endif

【问题讨论】：

*** 不是免费的写代码服务，请查看how to write a good question

您应该将数据存储在 vue 数据变量中，并使用 v-if 和 v-else 来实现 vue 条件。

@Joseph 不需要您的回答。谢谢！我得到了另一个答案

【参考方案1】：

要转换刀片文件中的@if 分支，请使用<template>s 和v-if/v-else：

<template v-if=" Auth::user()->avatar != null ">
    <img src=" URL::to('storage/app/public') . '/' . Auth::user()->avatar "
        class="img-circle elevation-2" >
</template>
<template v-else>
    <template v-if=" Auth::user()->gender == 'Male' ">
        <img src=" URL::asset('public/bower_components/admin-lte/dist/img/fb-male.jpg') "
            class="img-circle elevation-2" >
    </template>
    <template v-else>
        <img src=" URL::asset('public/bower_components/admin-lte/dist/img/female-fb.jpg') "
            class="img-circle elevation-2" >
    </template>
</template>