在 React 组件中渲染 Meteor 模板答案

【问题标题】：Rendering Meteor Templates in React Components在 React 组件中渲染 Meteor 模板
【发布时间】：2016-06-02 15:35:01
【问题描述】：

让我有一个带有模板 {{loginButton}} 的 loginbutton.html 文件。

<template name="loginButton">
   //rest of code
</template>

如何在反应组件中呈现它。我环顾四周，找到了几个答案，但老实说，我需要更多指导，因为我对 Meteor 还很陌生。以下是我找到的可能答案的链接。我只是不知道如何实现这一点，或者这是否是我真正想要的。

https://gist.github.com/emdagon/944472f39b58875045b6

【问题讨论】：

只是好奇，转jsx有那么难吗？（并从反应虚拟 dom 中受益）
不，但我想从 iOS 相机中添加一些特定的自动生成流星功能，该功能仅适用于 Blaze 渲染

标签： meteor reactjs meteor-blaze

【解决方案1】：

我终于解决了这个问题。如果您尝试在反应组件中使用 blaze 模板，您必须确保您的流星应用程序在客户端使用“模板”（以及在我使用的包中）。之后，在创建组件时，只需按照上面链接中的说明将模板作为道具传递：

Base.components.photoButton = React.createClass({

componentDidMount: function() {

    var componentRoot = React.findDOMNode(this);

    var parentNode = componentRoot.parentNode;

    parentNode.removeChild(componentRoot);

    this.view = Blaze.render(this.props.template, parentNode);

},

componentWillUnmount: function() {
    // Clean up Blaze view
    Blaze.remove(this.view);
},

render: function() {

    return (<div/>

) 

},

}));

【讨论】：

【解决方案2】：

有一个不错的氛围包blazetoreact。

这很简单。如果你有这个 Blaze 模板：

<template name="loginButton">
   <!-- rest of code -->
</template>

然后你就可以把它当成 React 组件了：

const LoginButton = BlazeToReact('loginButton');

class SomeComponent extends React.Component {
  render() {
    return (
      <div>
        <LoginButton />
      </div>
    );
  }
}

【讨论】：

我其实没看到这个。这是一个很酷的人。虽然我已经解决了这个问题，但我打算在这个周末的某个时候尝试一下。