Laravel Vue JSボタンがリダイレクト時に無効になっていない

Question

クリックしたときに無効な属性が表示され、クリック時にaria-disabled = "true"というボタンが追加されました。しかし、ページがリロードされると、ブール値trueを渡していても、ボタンは無効のままではありません。私は警告を追加し、何らかの理由でbuttonStatが真であっても、私は偽の値を取得します。

コントローラ

public function syncOrders() { 
    return redirect('/orders')->with(compact('orders'))->with('buttonState', true); 
} 

ビュー

<sync-button v-cloak :active="{{ json_encode($buttonState) }}"></sync-button> 

JS

<template> 
    <button class="btn btn-primary" style="margin:5px;" 
    :disabled="isDisabled" :aria-disabled="isDisabled" 
    @click="sync">Sync Orders</button></template> 

<script> 
    export default { 
     props: ['active', 'old'], 
     computed: { 
      isDisabled() { 
       return this.active; 
      } 
     }, 
     methods: { 
      sync() { 
       this.active = ! this.active; 

      } 
     } 
    } 
</script> 

Answer 1

これを試してみてください。

<sync-button v-cloak :active="{{ json_encode(session('buttonState')) }}"></sync-button>