如何将布尔值从 Blade 传递到 Vue 组件 Laravel 7？

Question

我正在尝试IF在 Vue 组件中使用 true/false 或 1/0实现条件。我经历了一些早先提出的问题，但无法得到它。请帮帮我。

IFtrue即使dd给出 ，条件也不给出输出true。

控制器（我尝试了两种方法，以便我可以通过 true/false 或 1/0 获得成功，在页面上的两种方法中，我都可以使用 dd($isExamAssigned) 获得 1/0 或 true/false）：

    dd($isExamAssigned); // here I'm able to get 1 or 0

刀片.php：

    <quiz-component
   
   :isExamAssigned = "{{$isExamAssigned}}"
   >
</quiz-component>

Component.vue 的代码部分：

props:['isExamAssigned'],

data(){

    return{

            isExamAssigned :this.isExamAssigned,

        }

这是 IF 条件：

<div v-if="isExamAssigned === '1'">

                        <!-- Code here for IF -->

                    </div>


                    <div v-else>

                        <!-- Code here for ELSE -->

                    </div>

我尝试了不同的方法来获取值，例如：

<div v-if="isExamAssigned === 1">

<div v-if="isExamAssigned === true">

<div v-if="isExamAssigned">

但我无法执行条件。

谢谢。

Answer 1

Himanshu的答案是正确的，也可以写成这样：

:isExamAssigned='@json($isExamAssigned)'

Answer 2

尝试在您的blade.php 文件中传递这样的道具

:isExamAssigned="{{ json_encode($isExamAssigned) }}"

这将以布尔格式发送道具。

Answer 3

您将其设置为'1'vue 组件中的字符串值。稍后你再将它与整数、布尔值和布尔值进行严格比较。最正确的方法是将其设置为真正的布尔值，如下所示。你的第二种方法会起作用。

$isExamAssigned = DB::table('quiz_user')->where('user_id', $authUser)->where('quiz_id', $quizId)->exists();

现在 PHP 类型很奇怪，如果你打印出来，$isExamAssigned它会打印出 1。你可以尝试一下{{true}}，自己看看结果。为了避免这种情况，请在设置组件时在刀片文件中执行以下检查。

:isExamAssigned = "{{$isExamAssigned ? 'true' : 'false'}}"

这将使以下 if 语句起作用。

<div v-if="isExamAssigned === true">

<div v-if="isExamAssigned">