1. 程式人生 > >layui 根據下拉框選擇 顯示圖片

layui 根據下拉框選擇 顯示圖片

圖示:
 <div class="layui-col-md6">
    <label class="layui-form-label">圖示</label>
    <div class="layui-input-block">
        <select  id="photo"  lay-filter="photo" name="photo" v-model="iotAssertSensorType.photo">
           <option value="../../statics/img/噴淋.png" selected="selected">噴淋</option>
            <option value="../../statics/img/水泵.png">水泵</option>
            <option value="../../statics/img/水箱.png">水箱</option>
            <option value="../../statics/img/消防.png">消防</option>
            <option value="../../statics/img/集水井.png">集水井</option>
            <option value="../../statics/img/集水井.png">發電機</option>
        </select>
    </div>

    <img name="photoImg" :src="iotAssertSensorType.photo" >
</div>
// 繫結表單下拉框事件
form.on('select(photo)', function(data){
    document.photoImg.src=data.value;

});