zoukankan      html  css  js  c++  java
  • iview 父组件动态传值给子组件

    父组件
    <maintenance-super :show="{'modalSuper':modalSuper,'myData':myData}" @on-close="closeModal" ></maintenance-super>

     

    父组件
     <maintenance-super :show="{'modalSuper':modalSuper,'myData':myData}" @on-close="closeModal" ></maintenance-super>
     1 export default {
     2   components: { MaintenanceSuper},
     3   data() {
     4     return {
     5       value:{
     6         telephone:null,
     7       },
     8       myData: {
     9         pageNum: 1,
    10         pageSize: 10,
    11         total: 0,
    12         userModel: {
    13           id: null,
    14           account: null,
    15           director: null, //负责人
    16         }
    17       },
    18 }

    子组件

    <template>
      <div>
        <!-- =================== 管理员:表格 =================================== -->
        <Modal :title="title" v-model="modalSuper" width="800" :closable="false" @on-hide="hide">
          <Table border :columns="superColumns" :data="superData">
            <template slot-scope="{ row, index }" slot="action">
              <Button type="primary" size="small" @click="restPassWordInfo(row,index)">重置密码</Button>
              <Button type="error" size="small" @click="disableAccount(row,index)">警用</Button>
            </template>
          </Table>
          <!-- ======================= 分页 ==================================== -->
          <Page
            :total="superForm.total"
            :current="superForm.pageNum"
            :page-size="superForm.pageSize"
            @on-change="handlePageSuper"
            @on-page-size-change="handlePageSizeSuper"
            class="tablePage"
          />
    
          <div style="text-align: right;margin-top: 10px;">
            <Button @click="handleResetSuper('searchData')">取消</Button>
            <Button icon="md-add" type="primary" @click="toSuperModalAdd">新建管理员账户</Button>
          </div>
          <div slot="footer"></div>
        </Modal>
      </div>
    </template>
    props:['show','myData'],
      watch: {
        show(validate) {
          console.log(validate,'1')
          if (validate.modalSuper == true) {
            this.modalSuper = validate.modalSuper;
            this.getTableDataPage();
          }
        }

    传值给父,弹框关闭

        handleResetSuper(name) {
          // this.modelSuperAdd = false;
          // this.$refs[name].resetFields();
          this.modalSuper = false;
          this.$emit("on-close", false);
        },
        onClose() {
          this.$emit("on-close", false);
        },

    父组件接收到子组件的传值

      methods: {
        closeModal(newVal) {
          this.modalSuper = newVal;
        }
    }

     

  • 相关阅读:
    数据结构总结——线段树
    [bzoj2131]免费的馅饼 树状数组优化dp
    [机房练习赛7.26] YYR字符串
    博客已搬家
    AFO
    COGS-2551 新型武器
    UVALive-3716 DNA Regions
    UVALive-4850 Installations
    UVALive-3983 Robotruck
    UVA-10859 Placing Lampposts
  • 原文地址:https://www.cnblogs.com/wudixiaoguaishou/p/11903979.html
Copyright © 2011-2022 走看看