dua55014 2015-10-09 20:18
浏览 61
已采纳

将php数据库值绑定到react.js

I will try to make this question as short as possible.

I am trying to do some react.js server-side rendering but I am having a difficult time refactoring that info that I aquired from doing research online and applying it to my project.

I am using route model binding for all my routes in the application using the username in the mysql database. I have some routes within the react.js

Look at the snippet below:

var FileUpload = React.createClass({

  handleFile: function(e) {
    var reader = new FileReader();
    var file = e.target.files[0];

    if (!file) return;

    reader.onload = function(img) {
      React.findDOMNode(this.refs.in).value = '';
      this.props.handleFileChange(img.target.result);
    }.bind(this);
    reader.readAsDataURL(file);
  },

  render: function() {
    return (
      <input ref="in" type="file" accept="image/*" action="images/{user}/dpUpload" onChange={this.handleFile} />
    );
  }
});

If you take a look within render:function() where the HTML input tag, action has a route of images/{user}/dpUpload. Everyone who knows laravel that {user} can bind to be admin in a RESTful way. I need to bind whatever value the database gives me to react. This is what I'm currently getting

View the images/{user}/dpUpload

  • 写回答

1条回答 默认 最新

  • drymoeuka282427675 2015-10-11 06:56
    关注

    You'd like the user variable available in React without having to do an ajax request for it?

    You could embed it in the DOM. Perhaps in a data-user attribute.

    // On your page
    <div id="user" data-user="admin"></div>
    
    // In React
    render: function() {
        var user = document.getElementById("user").getAttribute("data-user");
        return (
          <input 
            ref="in" 
            type="file" 
            accept="image/*" 
            action="images/{user}/dpUpload" 
            onChange={this.handleFile} />
        );
    }
    

    You could also just put the user variable within a script tag on your page and access it in React with window.myUserVariable.

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 fpga自动售货机数码管(相关搜索:数字时钟)
  • ¥20 Python安装cvxpy库出问题
  • ¥15 用前端向数据库插入数据,通过debug发现数据能走到后端,但是放行之后就会提示错误
  • ¥15 python天天向上类似问题,但没有清零
  • ¥30 3天&7天&&15天&销量如何统计同一行
  • ¥30 帮我写一段可以读取LD2450数据并计算距离的Arduino代码
  • ¥15 C#调用python代码(python带有库)
  • ¥15 活动选择题。最多可以参加几个项目?
  • ¥15 飞机曲面部件如机翼,壁板等具体的孔位模型
  • ¥15 vs2019中数据导出问题