国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

使用ant design的modal中嵌入form表單,動態獲取數據

Forelax / 1518人閱讀

摘要:最近在做一個公司的項目,使用的是然后用了,在做一個功能的時候使用了里面還嵌套了一個子組件,就想子組件里的能動態獲取然后從接口拉數據,但是始終不行因為這個只進去的時候會渲染,后面就不會了。

最近在做一個公司的項目,使用的是react然后用了ant design,在做一個功能的時候使用了modal,modal里面還嵌套了一個子組件,就想子組件里的id能動態獲取然后從接口拉數據,但是始終不行因為componentWillMount這個只進去的時候會渲染,后面就不會了。折騰了大半天也上了相關論壇,什么onRef 呀,或者直接帶事件的方法,只要進了Modal都不行,后來終于發現一個modal的相關參數實現了。以下是具體代碼:

    //這是點擊事件
    onChange = (e) => {
        // console.log(e);
        this.setState({
            currentDevId: e.record.id, 
            title:e.record.device_name,
            visible:true
        });
    }

此處設置destroyOnClose={true}即可

    
                    
            
                
            
            
        
                

然后子組件在componentWillMount里面通過Props接收 即可
或者還可以在態窗的取消按鈕添加事件,如下

resetFields()  //重置一組輸入控件的值(為 initialValue)與狀態,如不傳入參數,則重置所有組件

附正常情況父組件調用子組件事件的方法-直接上代碼:
父組件:

import React from "react";
import {Button} from "antd";
import Hz from "./Child";

export default class Inspect extends React.Component {

    onRef = (ref) => {
        this.child = ref
    }

    click = (e) => {
        // this.child.myName()
    }

    render() {
        return(
            
) } }

子組件:

import React from "react";

export default class Child extends React.Component {
    
    componentDidMount(){
        this.props.onRef(this)
    }

     myName = () =>{
      alert(11111111111111)

     }

    render() {
        return(
            
設備巡檢子組件....
) } }

文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。

轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/97928.html

相關文章

  • 長期更新,記錄一下近期工作涉及到內容(DvaJs Ant Design

    摘要:表單域表單一定會包含表單域,表單域可以是輸入控件,標準表單域,標簽,下拉菜單,文本域等。如果發現下拉菜單跟隨頁面滾動,或者需要在其他彈層中觸發,請嘗試使用將下拉彈層渲染節點固定在觸發器的父元素中。 DvaJs dispatch在 dva 中,connect Model 的組件通過 props 可以訪問到 dispatch,可以調用 Model 中的 Reducer 或者 Effects...

    MadPecker 評論0 收藏0
  • Dva + Ant Design 前后端分離之 React 應用實踐

    摘要:數據緩存對于一個應用來說,緩存是很重要的一步。所以,比較常見的方法就是將數據緩存在中。什么時候做數據緩存例用戶信息緩存參見在中配置了檢測中的是否存在。 源站鏈接 https://tkvern.com 繼 Rails 從入門到完全放棄 擁抱 Elixir + Phoenix + React + Redux 這篇文章被噴之后,筆者很長一段時候沒有上社區逛了?,F在 tkvern 又回歸了,給...

    tainzhi 評論0 收藏0
  • Ant-Design-組件-——-Form表單(一)

    摘要:擅長網站建設微信公眾號開發微信小程序開發小游戲制作企業微信制作建設,專注于前端框架服務端渲染技術交互設計圖像繪制數據分析等研究。 Ant Design of React @3.10.9 拉取項目 luwei.web.study-ant-design-pro, 切換至 query 分支,可看到 Form 表單實現效果 實現一個查詢表單 showImg(https://segmentfau...

    trilever 評論0 收藏0
  • Vue高效UI組件庫—iView開發實踐

    摘要:它的文檔也是相當詳細,每個功能都配有詳細說明和實例代碼,直接復制就可以使用,我們也計劃在明年啟動英文文檔翻譯計劃。明年會啟動英文文檔翻譯計劃,也希望喜歡和支持,同時英語不錯的同學可以加入我們,一起參與翻譯。 前段時間在微軟參加活動,分享了 TalkingData 開源的基于 Vue.js 的高效 UI 組件庫 iView 的一些開發經驗,現整理成文,和大家探討。 showImg(htt...

    wean 評論0 收藏0
  • Ant design pro 開發筆記 - 表單數據綁定

    摘要:支持表單雙向綁定,開發過程中無需通過回調函數去獲取組件的值,通過可以自動完成數據綁定的功能。如果我們通過獲取了數據之后,表單數據不會發生變化。注意使用這個函數必須用封裝需要綁定的字段。 antd支持表單雙向綁定,開發過程中無需通過onChange()回調函數去獲取組件的值,通過 getFieldDecorator() 可以自動完成數據綁定的功能。 { getFieldDecor...

    zsy888 評論0 收藏0

發表評論

0條評論

Forelax

|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<