獲取錯誤未捕獲TypeError：value.replace不是一個函數

基本上即時創建一個Markdown預覽器在Reactjs截至現在我得到錯誤像未捕獲TypeError：value.replace是不是一個函數，並沒有想法什麼導致它任何幫助在這裏如果我從這裏刪除this.format危險SetInnerHTML = {this.format（（this.rawMarkup（）））} />工作正常，但在輸入框上鍵入時，如果我按下輸入它不會帶我到下一行獲取錯誤未捕獲TypeError：value.replace不是一個函數

var App =React.createClass({ 
 
    getInitialState:function(){ 
 
     return{ 
 
      value:"My Value" 
 
     } 
 
    }, 
 
    updateValue:function(modifiedValue){ 
 
     this.setState({ 
 
      value:modifiedValue 
 
     }) 
 
    }, 
 

 
    format: function (value) { 
 
     return { __html: value.replace(/\r?\n/g, '<br>') }; 
 
    }, 
 
    rawMarkup: function() { 
 
     var rawMarkup = marked(this.state.value.toString(), {sanitize: true}); 
 
     return { __html: rawMarkup }; 
 
    }, 
 
    render:function(){ 
 
     return(
 
      <div className="inputBox container-fluid"> 
 
       <h1 className="text-center text-primary">Hello Coders !!!</h1> 
 
       <div className="row"> 
 
        <div className="col-md-6 col-md-offset-1"> 
 
         <InputBox value={this.state.value} updateValue={this.updateValue}/> 
 
        </div> 
 

 
        <div 
 
         className="outputBox col-md-6 col-md-offset-1" 
 
         dangerouslySetInnerHTML={this.format((this.rawMarkup()))} /> 
 
       </div> 
 
      </div> 
 
     ); 
 
    } 
 
}); 
 

 
var InputBox =React.createClass({ 
 
    update: function() { 
 
     var modifiedValue = this.refs.initialValue.value; 
 
     this.props.updateValue(modifiedValue); 
 
    }, 
 

 
    render:function(){ 
 
     return(
 
      <textarea type="text" value={this.props.value} onChange={this.update} ref="initialValue"> 
 
         </textarea> 
 

 
     ); 
 
    } 
 
}); 
 
ReactDOM.render(<App />, 
 
    document.querySelector("#app") 
 
);

<!DOCTYPE html> 
 
<head> 
 
    <meta charset="UTF-8" /> 
 
    <title>React Tutorial</title> 
 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
    <style> 
 
     .outputBox,textarea{ 
 
      width: 400px; 
 
      border: 5px solid gray; 
 
      margin: 0; 
 
      height: 500px; 
 
     } 
 

 
    </style> 
 
</head> 
 
<div id="app"></div> 
 
<script src="demo.js" type="text/babel"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.2/marked.min.js"></script> 
 
</body> 
 
</html>

來源

2016-02-29 user5323957

當您使用markdown你不需要更換\n到<br>，你可以設置breaks選項true

rawMarkup: function() { 
    return { __html: marked(this.state.value, { sanitize: true, breaks: true }) }; 
},

Example

來源

2016-02-29 08:30:41

工作謝謝 – user5323957

獲取錯誤未捕獲TypeError：value.replace不是一個函數

回答

相關問題