当我提交表单而不选择任何数据时,v-show无法正常工作

时间:2018-10-15 03:43:20

标签: javascript vue.js

HTML模板

LIKE

这是我的JS

<div class="control-group">
                <label for="MainContent_ddlCourse" id="MainContent_Label1" class="control-label">Course</label>
                <div class="controls">
                    <select name="ctl00$MainContent$ddlCourse" id="MainContent_ddlCourse" class="input-block-level" v-model="selectedCourse" v-on:change="courseChanged">
                        <option value="">Please choose...</option>
                        <option v-for="course in courseList" v-bind:value="course.CourseId">{{ course.Name }}</option>
                    </select>
                </div>
                <p v-if="invalidCourse">Invalid Course Selected</p>
            </div>

1 个答案:

答案 0 :(得分:0)

我假设您是在谈论v-if而不是v-show,您需要添加this才能使用vue数据

    if (!this.selectedCourse) this.invalidCourse = true;

或简单地逆转条件

    <p v-if="!selectedCourse">Invalid Course Selected</p>