在React组件中呈现Meteor模板
我有一个带有模板{{loginbutton}的loginbutton.html文件在React组件中呈现Meteor模板,meteor,reactjs,meteor-blaze,Meteor,Reactjs,Meteor Blaze,我有一个带有模板{{loginbutton}的loginbutton.html文件 <template name="loginButton"> //rest of code </template> //代码的其余部分 如何在react组件中呈现此内容。我环顾四周,找到了一些答案,但说实话,我需要更多的指导,因为我对Meteor还比较陌生。下面是我找到的一个可能答案的链接。我只是不知道如何实现这一点,或者这是否是我真正想要的 我终于解决了这个问题。如果你试图在r
<template name="loginButton">
//rest of code
</template>
//代码的其余部分
如何在react组件中呈现此内容。我环顾四周,找到了一些答案,但说实话,我需要更多的指导,因为我对Meteor还比较陌生。下面是我找到的一个可能答案的链接。我只是不知道如何实现这一点,或者这是否是我真正想要的
我终于解决了这个问题。如果你试图在react组件中使用blaze模板,你必须确保你的meteor应用程序在客户端(以及我使用的包中)使用“模板”。之后,在创建组件时,只需按照上面链接中的说明将模板作为道具传入:
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/>
)
},
}));
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(){
//清理火焰视图
移除(此视图);
},
render:function(){
返回(
)
},
}));
有一个很好的大气包
这很简单。如果您有此Blaze模板:
然后您可以将其用作反应组件:
const LoginButton=BlazeToReact('LoginButton');
类SomeComponent扩展了React.Component{
render(){
返回(
);
}
}
只是好奇,把它转换成jsx有那么难吗?(并从react虚拟dom中获益)不,但我想从iOS摄像头中添加一些特定的自动形成流星功能,该功能仅适用于Blaze渲染,我实际上没有看到这一点。这是个很酷的人。虽然我已经解决了这个问题,但我打算在这个周末的某个时候试一试。