Question

我正在使用React + Meteor项目中的Accounts UI meteor包，并希望使用属性loginButtons呈现align="right"模板。在Blaze中，代码只是{{> loginButtons align="right"}}，但我对如何在React中添加此属性感到茫然。

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { Template } from 'meteor/templating';
import { Blaze } from 'meteor/blaze';

export default class AccountsUIContainer extends Component {
  componentDidMount() {
  this.view = Blaze.render(Template.loginButtons, // How do I give loginButtons `align="right`?
    ReactDOM.findDOMNode(this.refs.container));
  }

  componentWillUnmount() {
    Blaze.remove(this.view);
  }

  render() {
    return <span ref="container" />;
  }
}

我认为Blaze.renderWithData()可能是解决方案的一部分，但到目前为止，我使用这种方法的测试还没有奏效。我也认为人们已经创建了在React中使用Blaze模板的解决方案，但我不确定这些替代解决方案是否是在Meteor 1.4中解决此问题的“正确”方法。

Answer 1

答案就在文档中。首先是meteor add gadicc:blaze-react-component，然后是组件

import React from 'react';
import Blaze from 'meteor/gadicc:blaze-react-component';

const App = () => (
  <div>
    <Blaze template="loginButtons" align="right" />
  </div>
);

如何更改React组件内的Blaze模板的属性

1 个答案: