javascript - 将 php 数据库值绑定(bind)到react.js

Question

我会尽力让这个问题尽可能简短。

我正在尝试做一些react.js服务器端渲染，但我很难重构我从在线研究中获得的信息并将其应用到我的项目中。

我正在使用 mysql 数据库中的用户名对应用程序中的所有路由使用路由模型绑定(bind)。我在react.js中有一些路由

看下面的代码片段:

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} />
    );
  }
});

如果您查看 render:function() 中的 HTML input 标记，action 有一个 images 路径/{用户}/dpUpload。每个了解 laravel 的人都可以通过 RESTful 方式将 {user} 绑定(bind)为 admin。我需要绑定(bind)数据库给我的任何值来使用react。这就是我目前得到的

Answer 1

您希望在 React 中使用 user 变量，而无需对其执行 ajax 请求吗？

您可以将其嵌入到 DOM 中。也许在 data-user 属性中。

// 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} />
    );
}

您还可以将用户变量放在页面上的脚本标记中，并在 React 中使用 window.myUserVariable 访问它。