2016-09-30 21 views
0

我的模態正常工作,即打開和關閉第一次完美,但是,它不會再打開。我看到下面的錯誤控制檯 -Foundation Reveal Modal未使用React進行關閉15.3.2

  1. Uncaught NotFoundError: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.

  2. Uncaught (in promise) Error: Attempted to update component 'ErrorModal' that has already been unmounted (or failed to mount).

我需要我的模式我關閉每次毀滅?

ErrorModal.jsx

var React = require('react'); 

var ErrorModal = React.createClass({ 
    componentDidMount: function() { 
    var modal = new Foundation.Reveal($('#error-modal')); 
    modal.open(); 
    }, 
    render: function() { 

    return (
     <div className='reveal tiny text-center' id='error-modal' data-reveal=""> 
     <h4>Some title</h4> 
     <p>Our Error msg</p> 
     <p> 
      <button className ='button hollow' data-close=""> 
      Okay 
      </button> 
     </p> 
     </div> 
    ); 

    } 
}); 

module.exports = ErrorModal; 

回答

0

可以使用反應-DOM讓反應採取更新DOM,而不是基礎的護理嘗試此解決方案

/* global $, Foundation */ 
import React from 'react' 
import ReactDOM from 'react-dom' 
import ReactDOMServer from 'react-dom/server' 

class ErrorModal extends React.Component { 
    componentDidMount() { 
    const modalContent = (
     <div id='error-modal' 
     className='reveal tiny text-center' 
     data-reveal=''> 
     <h4>Some title</h4> 
     <p>our error message</p> 
     <p> 
      <button className='button hollow' data-close=''> 
      Okay 
      </button> 
     </p> 
     </div> 
    ) 
    const modalElement = $(ReactDOMServer.renderToString(modalContent)) 
    $(ReactDOM.findDOMNode(this)).html(modalElement) 

    const modal = new Foundation.Reveal($('#error-modal')) 
    modal.open() 
    } 
    render() { 
    return (
     <div /> 
    ) 
    } 
} 

export default ErrorModal 
0

我有類似的情況現在ZF ==與揭示6.2.1

基金會顯示莫代爾後運行modal.open();基礎變化DOM和移動模式結束的身體的 - 追加新的覆蓋。 組件離開反應安裝節點 - 這是問題