在onClick中传递单个值（不使用表单提交）

-1

与其创建几个putPriority抓取，我理想只是想传递一个奇异值。在onClick中传递单个值（不使用表单提交）

但该值不经由用户（即，不是一个输入域）

我想通过一个onClick通过该值被输入。

在我的示例中，我希望onClick在fetch（this.state.level）中将单个数字传递给“status”。

基本上我希望它是这样工作的：

putPriority: function(e) { 
    e.preventDefault(); 
    return fetch(DATA_API, { 
    method: 'PUT', 
    body: JSON.stringify({ 
     status:this.state.level, 
     tag:[ 
      {} 
      ] 
     }) 
     }) 
     .then(function(res){ return res.json(); }) 
     .then(function(data){ alert(JSON.stringify(data)) }) 
    }, 


    ... 

    render: function(){ 
     return (
    <Button onClick={this.putPriority} title="level" value="1">High </Button> 

    <Button onClick={this.putPriority} title="level" value="2">Medium </Button> 

    <Button onClick={this.putPriority} title="level" value="3">Low </Button> 
    } 
)};

来源

2016-11-07 Ycon

如何'Button'定义？它可以不只是在调用'onClick'函数时传递'value'的值吗？ –

你可以使用bind来传递值来点击函数...例如this.putPriority.bind（this，yourvalue） – abhirathore2006

你可以使用bind()将值传递给函数，而不是this.state.level只是利用价值liek

body: JSON.stringify({ 
    status:value, 
    tag:[ 
     {} 
     ] 
    })

var App = React.createClass ({ 
 
putPriority: function(value, e) { 
 
    e.preventDefault(); 
 
    console.log(value); 
 
    }, 
 

 
    render: function(){ 
 
     return (
 
      <div> 
 
    <button onClick={this.putPriority.bind(this, '1')} title="level" value="1">High </button> 
 

 
    <button onClick={this.putPriority.bind(this, "2")} title="level" value="2">Medium </button> 
 

 
    <button onClick={this.putPriority.bind(this, "3")} title="level" value="3">Low </button> 
 
</div> 
 
) 
 
} 
 
    
 
}) 
 
ReactDOM.render(<App/>, document.getElementById('app'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> 
 
<div id="app"></div>

来源

2016-11-07 07:26:53

，你可以用它来获取当前值：

putPriority: function(e) { 
e.preventDefault(); 
var currentStatus = e.currentTarget.getAttribute("value"); 
return fetch(DATA_API, { 
method: 'PUT', 
body: JSON.stringify({ 
    status: currentStatus, 
    tag: [ 
     {} 
     ] 
    }) 
    }) 
    .then(function(res){ return res.json(); }) 
    .then(function(data){ alert(JSON.stringify(data)) }) 
},

这将解决你的问题

var currentStatus = e.currentTarget.getAttribute("value");

来源

2016-11-07 06:30:48

'Button'似乎是一个自定义组件。没有更多的代码，不清楚事件对象是否传递给'putPriority'。 –

是的，你是对的，但他正在使用的反应和相应的反应语法“e”将事件，以及他定义e.preventDefault（）;所以“e”是“事件”，所以我们可以访问它的相关元素。 –

如果我们在讨论'button' HTML元素，那么是的。但是在代码中他们使用了一个'Button' **组件**（注意大写字母B对小写字母b），这是我们不知道的。我们不知道该组件使用'onClick'属性做什么。 –

在onClick中传递单个值（不使用表单提交）

回答

相关问题