@4geit/rct-assembler-component 中文文档教程

Question

@4geit/rct-assembler-component

---

选择组件并将它们组装在一起

Demo

可以使用实时故事书查看组件的外观 @ http://react-packages.ws3.4ge.it

Installation

1. A recommended way to install @4geit/rct-assembler-component is through npm package manager using the following command:

npm i @4geit/rct-assembler-component --save

或使用 yarn 使用以下命令：

yarn add @4geit/rct-assembler-component

2. Depending on where you want to use the component you will need to import the class RctAssemblerComponent to your project JS file as follows:

import RctAssemblerComponent from '@4geit/rct-assembler-component'

例如，如果你想在你的 App.js 组件中使用这个组件，你可以在 JSX 代码中使用 RctAssemblerComponent 组件，如下所示：

import React from 'react'
// ...
import RctAssemblerComponent from '@4geit/rct-assembler-component'
// ...
const App = () => (
  <div className="App">
    <RctAssemblerComponent />
  </div>
)

AngularJS

rct-assembler-component 也支持集成在一个AngularJS 应用程序，因此您可以将 AngularJS 组件指令调用到您的 AngularJS 应用程序中，它会正确显示，您可以在此处。

以下是让组件在 AngularJS 应用程序上运行所需遵循的步骤：

• install the component thanks to npm as shown above
• add the following tag to the main index.html file of your app:

<script src="node_modules/@4geit/rct-ng-vendor/dist/index.ng.js"></script>
<script src="node_modules/@4geit/rct-assembler-component/dist/index.ng.js"></script>

• inject the component AngularJS module to your app module as below:

angular
  .module('app', ['rct-assembler-component'])
  // ...

• use the component directive where ever you want to add the component in your app as follow:

<rct-assembler-component></rct-assembler-component>