javascript - Le sélecteur dans l'interface utilisateur de Vue+Element affiche toujours la valeur initiale et n'affiche pas la valeur d'espace réservé
巴扎黑
巴扎黑 2017-06-24 09:43:25
0
2
1625

Utilisez vue avec l'élément UI comme zone de requête. En raison de la liaison de données bidirectionnelle, select affiche toujours directement la valeur initialisée lors de l'initialisation sans afficher la valeur dans l'espace réservé, comme le montre la figure :

Mais le backend interroge par défaut tout sans paramètres. Si vous remplacez toutes les valeurs par d'autres valeurs, la requête ne produira pas de données, ce qui est embarrassant ! !
Veuillez demander à Dieu de le résoudre !

<p class="search-area m-t-md">
          <p class="header clearfix">
            <h3 class="text">仓库管理</h3>
            <span class="btn-text" @click="modalShow = true"><i class="icon-plus"></i>添加仓库</span>
          </p>
          <p class="inner">
            <el-input v-model="searchInfo.houseCode"  placeholder="请输入仓库编码或名称"></el-input>
            <el-select v-model="searchInfo.houseType"  placeholder="请选择仓库类型">
              <el-option value="" label="全部"></el-option>
              <el-option value="1" label="总店"></el-option>
              <el-option value="2" label="门店"></el-option>
            </el-select>
            <el-select v-model="searchInfo.storeNo"  placeholder="请选择所属门店">
              <el-option value="" label="全部"></el-option>
              <el-option v-for="store in storeLists" :key="store.storeNo" :value="store.storeNo" :label="store.storeName"></el-option>
            </el-select>
            <el-button type="primary" @click="getDepotLists">查询</el-button>
          </p>
        </p>
        
        <script type="text/ecmascript-6">
  import {mapState} from 'vuex'
    export default {
        name: 'depot',
        data () {
            return {
               
                searchInfo:{
                  method:'cn.linkea.mshop.houseFacade.findPageList',
                  chainCode:'',
                  createOperator:'',
                  houseCode:'',
                  houseName:'',
                  houseType:'',
                  pageIndex:'1',
                  pageSize:'10',
                  storeManager:'',
                  storeName:'',
                  storeNo:'',
                  updateOperator:''
                }
                
            }
        }
        

    }
</script>
巴扎黑
巴扎黑

répondre à tous(2)
巴扎黑

Vous pouvez le faire

<el-option value="all_list" label="all"></el-option>

<script>

if ( this.searchInfo.houseType === 'all_list' ) {
    this.searchInfo.houseType='';
}

</script>

Avis personnel, pour référence

曾经蜡笔没有小新

La première méthode
searchInfo.houseTypeLa valeur initiale est définie sur nullsearchInfo.houseType初始值设置null
第二种方法
<el-option value="-1" label="全部"></el-option>或者<el-option value="-1" label="全部"></el-option>La deuxième méthode
<el-option value="-1" label="All">< / el-option>ou <el-option value="-1" label="All"></el-option>

Lors de l'envoi de la demande, manuellement Le la valeur de -1 ou 0 est omise ! 🎜
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!