Question

我想创建一个动态依赖下拉列表（当我在第一个选择中选择Chantier时，第二个选择将充满Chantier的饰物）

SalarieController

   public function getChantier()
    {
        $data = Chantier::get();
        return response()->json($data);
    }
        public function getOuvrage(Request $request)
    {
        $data = State::where('chantier_id', $request->chantier_id)->get();
        return response()->json($data);
    }

路线\ api

Route::get('getChantier', 'SalariesController@getChantier');
Route::get('getOuvrage', 'SalariesController@getOuvrage');

Route \ wep.php

Route::get('payer', function () {
    return view('salarie.payer');
});

paye.blade.php

 <div class="card-body">
                        <div class="form-group">
                            <label>Chantier:</label>
                            <select class='form-control' v-model='chantier' @change='getOuvrage()'>
                              <option value='0' >Select Country</option>
                              <option v-for='data in chantiers' :value='data.id'>{{ data.chantier }}</option>
                            </select>
                        </div>

                        <div class="form-group">
                            <label>Select State:</label>
                            <select class='form-control' v-model='state'>
                              <option value='0' >Select State</option>
                              <option v-for='data in ouvrages' :value='data.id'>{{ data.ouvrage }}</option>
                            </select>
                        </div>
                    </div>

vuejs

export default {
    mounted() {
        console.log('Component mounted.')
    },
    data(){
        return {
            chantier: 0,
            chantiers: [],
            ouvrage: 0,
            ouvrages: []
        }
    },
    methods:{
        getChantier: function(){
          axios.get('/api/getChantier')
          .then(function (response) {
             this.chantiers = response.data;
          }.bind(this));

        },
        getOuvrage: function() {
            axios.get('/api/getOuvrage',{
             params: {
               chantier_id: this.chantier
             }
          }).then(function(response){
                this.ouvrages = response.data;
            }.bind(this));
        }
    },
    created: function(){
        this.getChantier()
}

}

Answer 1

问题出在{{ data.chantier }}上。我假设您正在使用Vue处理它，但是您必须告诉Blade忽略那些花括号，否则，它将尝试将其输出为不存在的php值。

将{{ data.chantier }}替换为@{{ data.chantier }}，应该这样做。

使用未定义的常数数据

1 个答案: