<div class="layui-form-item">                        <label class="layui-form-label">業務</label>                           <div  class="layui-input-inline">                         <select v-model="photoQuery.type" id="photoType">                            <option value="">請選擇</option>                            <option v-for="photoTypeEnum in photoTypeList"                                   :value="photoTypeEnum.code">

                             {{photoTypeEnum.value}}</option>                            </select>                      </div> 

靜態select，沒毛病

     <label class="layui-form-label">頻道</label>                             <div class="layui-input-inline">                          <select  id="channel">                            <option value="">請選擇</option>                            <option value="20">媒體報道</option>                            <option value="30">網站公告</option>                          </select>                     </div> 

後臺模版渲染，肯定不會存在問題。

layui-input-block沒問題，但是發現“文字”總是位於中間。

最開始以為是，居中對齊導致的。

手動設定text-align左對齊，還是不行。

layui-input-inline改為layui-input-block

所以，最開始懷疑是 vue和layui不相容導致的。

但是，網上找到了很多答案，都說是layui.form手動渲染，確實也渲染了。

大家都沒有遇到的問題，就自己遇到了，總是有哪個地方有點問題。

看了幾百次之後。。。

猛然間發現，是空格導致的。

正確的寫法：

<select v-model="photoQuery.type" id="photoType">                            <option value="">請選擇</option>                            <option v-for="photoTypeEnum in photoTypeList"                                   :value="photoTypeEnum.code">{{photoTypeEnum.value}}</option>                            </select>

吃過虧，才記憶深刻。