zoukankan      html  css  js  c++  java
  • iview form 表单的怪异小BUG

    当同一个弹窗中的表单重复利用时:

    我原先的代码逻辑是:

     1 <Form :label-width="100" class="mt20" ref="changeParam" :rules="ruleValidate"  :model="changeParam">
     2             <Row>
     3               <Col span="22">
     4                 <FormItem label="课程">
     5                   <Input v-model="info.f_lesson_name" disabled style="200px;"></Input>
     6                 </FormItem>
     7               </Col>
     8             </Row>
     9             <Row v-if="info.teacher_id > 0">
    10               <Col span="22" class='pr'>
    11                 <FormItem label="原授课老师">
    12                   <Input v-model="info.f_teacher_id" disabled  style=" 200px"></Input>
    13                 </FormItem>
    14               </Col>
    15             </Row>
    16             <Row>
    17               <Col span="22" class='pr'>
    18                 <FormItem v-if="info.teacher_id > 0" label="新授课老师" prop="teacher_id">
    19                   <i class="clearSelect" v-if="changeParam.teacher_id"  @click="clearSelect">X</i>
    20                   <Select
    21                     style=" 200px"
    22                     v-model="changeParam.teacher_id"
    23                     :disabled="changeParam.teacher_id ? true: false"
    24                     placeholder="请搜索后选择老师"
    25                     filterable
    26                     remote
    27                     :remote-method="searchTeacher">
    28                     <Option v-for="(item,key) in teacherList" :value="item.userid" :key="key"> {{item.f_campus ? item.f_campus: item.f_city }}-{{item.realname}}</Option>
    29                   </Select>
    30                 </FormItem>
    31                 <FormItem v-else label="授课老师" prop="teacher_id">
    32                   <i class="clearSelect" v-if="changeParam.teacher_id"  @click="clearSelect">X</i>
    33                   <Select
    34                     style=" 200px"
    35                     v-model="changeParam.teacher_id"
    36                     :disabled="changeParam.teacher_id ? true: false"
    37                     placeholder="请搜索后选择老师"
    38                     filterable
    39                     remote
    40                     :remote-method="searchTeacher">
    41                     <Option v-for="(item,key) in teacherList" :value="item.userid" :key="key"> {{item.f_campus ? item.f_campus: item.f_city }}-{{item.realname}}</Option>
    42                   </Select>
    43                 </FormItem>
    44               </Col>
    45             </Row>
    46             <Row>
    47               <Col span="22" class='pr' v-if="info.teacher_id > 0">
    48                 <FormItem label="理由" prop="reason_service" style="font-size: 14px;">
    49                   <Select v-model="changeParam.reason_service" style="200px;">
    50                     <Option v-for='(item,key) in reason_service' :value="key" :key='key'>{{item}}</Option>
    51                   </Select>
    52                 </FormItem>
    53               </Col>
    54             </Row>
    55             <Row v-if='changeParam.reason_service == 99'>
    56               <Col span="22" class='pa'>
    57                 <FormItem label="备注" prop="remark">
    58                   <template>
    59                     <Input type="textarea" v-model="changeParam.remark" :autosize="{minRows: 2,maxRows: 5}"
    60                            placeholder="备注" style="300px;"></Input>
    61                   </template>
    62                 </FormItem>
    63               </Col>
    64             </Row>
    65           </Form>

    更改后:

     1 <Form :label-width="100" class="mt20" ref="changeParam" :rules="ruleValidate"  :model="changeParam">
     2             <Row>
     3               <Col span="22">
     4                 <FormItem label="课程">
     5                   <Input v-model="info.f_lesson_name" disabled style="200px;"></Input>
     6                 </FormItem>
     7               </Col>
     8             </Row>
     9             <Row v-if="info.teacher_id > 0">
    10               <Col span="22" class='pr'>
    11                 <FormItem label="原授课老师">
    12                   <Input v-model="info.f_teacher_id" disabled  style=" 200px"></Input>
    13                 </FormItem>
    14               </Col>
    15             </Row>
    16             <Row>
    17               <Col span="22" class='pr'>
    18                 <FormItem v-if="info.teacher_id > 0" label="新授课老师" prop="teacher_id">
    19                   <i class="clearSelect" v-if="changeParam.teacher_id"  @click="clearSelect">X</i>
    20                   <Select
    21                     style=" 200px"
    22                     v-model="changeParam.teacher_id"
    23                     :disabled="changeParam.teacher_id ? true: false"
    24                     placeholder="请搜索后选择老师"
    25                     filterable
    26                     remote
    27                     :remote-method="searchTeacher">
    28                     <Option v-for="(item,key) in teacherList" :value="item.userid" :key="key"> {{item.f_campus ? item.f_campus: item.f_city }}-{{item.realname}}</Option>
    29                   </Select>
    30                 </FormItem>
    31                 <FormItem v-else label="授课老师" prop="teacher_id">
    32                   <i class="clearSelect" v-if="changeParam.teacher_id"  @click="clearSelect">X</i>
    33                   <Select
    34                     style=" 200px"
    35                     v-model="changeParam.teacher_id"
    36                     :disabled="changeParam.teacher_id ? true: false"
    37                     placeholder="请搜索后选择老师"
    38                     filterable
    39                     remote
    40                     :remote-method="searchTeacher">
    41                     <Option v-for="(item,key) in teacherList" :value="item.userid" :key="key"> {{item.f_campus ? item.f_campus: item.f_city }}-{{item.realname}}</Option>
    42                   </Select>
    43                 </FormItem>
    44               </Col>
    45             </Row>
    46             <Row>
    47               <Col span="22" class='pr' v-if="info.teacher_id > 0">
    48                 <FormItem label="理由" prop="reason_service" style="font-size: 14px;">
    49                   <Select v-model="changeParam.reason_service" style="200px;">
    50                     <Option v-for='(item,key) in reason_service' :value="key" :key='key'>{{item}}</Option>
    51                   </Select>
    52                 </FormItem>
    53               </Col>
    54             </Row>
    55             <Row >
    56               <!--错误的地方-->
    57               <Col span="22" class='pa' v-if='changeParam.reason_service == 99'>
    58                 <FormItem label="备注" prop="remark">
    59                   <template>
    60                     <Input type="textarea" v-model="changeParam.remark" :autosize="{minRows: 2,maxRows: 5}"
    61                            placeholder="备注" style="300px;"></Input>
    62                   </template>
    63                 </FormItem>
    64               </Col>
    65             </Row>
    66           </Form>

    具体原因我目前不清楚,但确实是把判断写在row中了,当更改后,就可以了;让自己下次注意。并且找时间找到为啥

  • 相关阅读:
    python __builtins__ set类 (60)
    python __builtins__ reversed类 (58)
    python __builtins__ range类 (56)
    python __builtins__ property类 (55)
    python __builtins__ memoryview类 (46)
    python __builtins__ map类 (44)
    python __builtins__ list类 (42)
    python __builtins__ license类 (41)
    (转)面试算法总结
    (Mark)JS中的上下文
  • 原文地址:https://www.cnblogs.com/mxyr/p/10256629.html
Copyright © 2011-2022 走看看