如何获取选择 vuejs 的 id 和 v-text答案

【问题标题】：How to get the id and v-text of a select vuejs如何获取选择 vuejs 的 id 和 v-text
【发布时间】：2020-01-31 11:50:31
【问题描述】：

如何获取 id，然后将 v-text 的值保存在表格中

我想将malla_curricular 表的id 保存在idMalla 字段中，并将字段pAcademicoInicio cicloLectivoInicio 的值保存在表periodoLectivoMallaOrigen 的字段periodoLectivoMallaOrigen 中

enter image description here

<Label>Seleccione el periodo de la malla</Label>
 <select v-model="idMalla" class="form-control col-md-12">
  <option v-for="malla in arrayPeriodo" :key="malla.id" :value="malla.id" v-text="malla.pAcademicoInicio + ' - ' + malla.cicloLectivoInicio">

 </option>

vue方法在这里我不知道如何获取值以将它们发送到另一个表

EventSubir(){
let me = this;
axios.post('/estudioreingresomat/registrar',{     
    'id': this.id,    
    'idMalla': this.idMalla,
    'periodoLectivoMallaOrigen': this.periodoLectivoMallaOrigen,
    'periodoLectivoMallRediseñada': this.periodoLectivoMallRediseñada,
}).then(function (response) {
    console.log('EXITO!!');    
}).catch(function (error) {
    console.log('error al ingresar el estudio!!');
    console.log(error);
});
},


public function store(Request $request)    {
   if (!$request->ajax()) return redirect('/');
   try{
        DB::beginTransaction();
        $estudioReingreso = new EstudioReingreso();
        $estudioReingreso->idMalla = $request->idMalla;
        $estudioReingreso->periodoLectivoMallaOrigen = $request->periodoLectivoMallaOrigen; 
        $estudioReingreso->periodoLectivoMallRediseñada = $request->periodoLectivoMallRediseñada; 
        $estudioReingreso->save();
        session(['estudioReingreso' => $estudioReingreso->id]); 

        DB::commit();

    } catch (Exception $e){
    echo('se tosteo lpm');
    DB::rollBack();
}
}

【问题讨论】：

标签： php laravel vue.js

【解决方案1】：

（我假设您已经获取了 arrayPeriodo 的数据）

如果这是您构建数据的方式，那么您可以访问 malla_selected 对象，其中将包含您在选项标签中所说的 :value。

模板：

<Label>Seleccione el periodo de la malla</Label>
<select v-model="selected_malla" class="form-control col-md-12"> <!-- changed idMalla to selected_malla, then in the option - the :value becomes the object itself -->
    <option
        v-for="malla in arrayPeriodo"
        :key="malla.id"
        :value="malla"
        v-text="malla.pAcademicoInicio + ' - ' + malla.cicloLectivoInicio">
    </option>

vue 组件：

export default {
    data(){
        return {
            malla_selected: null
            arrayPeriodo: [
                {
                    id: 1,
                    idMalla: 2,
                    pAcademicoInicio: 'foo',
                    cicloLectivoInicio: 'bar',
                }
            ]
        }
    }
    methods:{
        EventSubir(){
            axios.post('/estudioreingresomat/registrar',{
                'id': malla_selected.id,
                'idMalla': malla_selected.idMalla,
                'periodoLectivoMallaOrigen': malla_selected.periodoLectivoMallaOrigen,
                'periodoLectivoMallRediseñada': malla_selected.periodoLectivoMallRediseñada,
            }).then(function (response) {
                console.log('EXITO!!');
            }).catch(function (error) {
                console.log('error al ingresar el estudio!!');
                console.log(error);
            });
        }
    }
}

【讨论】：