Question

于2017年10月23日解决[见下文]

我试图将React Components写成Meteor Packages，我想我在某处做了一些非常错误的事情，我无法在网上找到任何样本。

我的包装设置如下：

Package.describe({
  name: 'bardia:mapackage',
  version: '0.0.1',
  summary: '',
  documentation: 'README.md'
});

Package.onUse(function(api) {
  api.versionsFrom('1.5.2');
  api.use('ecmascript');
  api.mainModule('mapackage.js');
});

我的mapackage.js为

import Comps from './Comps';

export const name = Comps;

和我的反应组件

import React, { Component } from 'react';

class Comps extends Component {
  render() {
    return (
      <div>
         welll this lah
      </div>
    );
  }
}

export default Comps;

并将其导入我的主应用程序时：

import {name} from 'meteor/bardia:mapackage'
const App = props => (
  <center>{name}</center>
);

它只返回

<center data-reactroot=""></center>

如果我替换导出const name = Comps导出const name =＆＃39; Comps＆＃39 ;;它将呈现＆＃39; Comps＆＃39;。意思是，它只渲染字符串。

我怎样才能上班！？

Answer 1

因此，在与其他开发人员交谈之后，我设法更好地了解了组件的呈现方式。作为一种解决方案，我使用React-Router重定向到每个组件，因为我最初希望它是这样的。

我使用的是CleverBeagle Pup Boilerplate，没什么好看的，它是一个最小的Meteor-React软件包，可以提供您所需的工具而不会使事情过于复杂。

如果您想获取正在运行的代码，请克隆此repo：REPO

克隆后，在文件夹中运行Meteor npm install并npm start ，Read More

在包文件夹中，我创建了一个名为Mapackage的示例包，它是所有魔法发生的地方。当我正在进行测试时，我会对此回购提交更改。

Comps.jsx

这只是一个简单的反应组件，需要导出

Mapackage.js

//Import Components that are going to be exported as Routes
import Comps from './Comps';

//Export Router and their components
const MaPack = ()=>{
  return(
    <div>
      <Route path='/maPack' exact={true} component={Comps} />
      //if you want more functionality on your routes
      <Route path='/maPack/:_id' exact={true} component={subMaPack} />
    </div>
  )
}

完成此操作后，您只需将路由组件导入路由器或交换机Read More

流星包中的反应组件

于2017年10月23日解决[见下文]

1 个答案:

Comps.jsx

Mapackage.js