メインコンテンツまでスキップ

カスタムコンポーネントよくある質問

1. 現在削除機能が見つかりません

内測期間中は削除機能を実装予定がありません。正式リリース後も削除機能がない可能性があります。削除機能を導入すると複雑な依存関係の問題が発生するため、当面の間は必須ではありません。現在は https://www.npmjs.com/ と似た形態になります。

2. 業務コンポーネントの理解方法

このリンクを参考にしてください

3. コンポーネントの構成

コンポーネントはビューと属性で構成されており、コンポーネントの利用側ではコンポーネントの属性を変更することで、コンポーネントが異なるビューを表示させることができます。 ビューはさらに設計ビューと実行時ビューに細分化でき、通常は設計ビューと実行時ビューを再利用できます。 コンポーネントの提供側では、コンポーネントのビューと属性をそれぞれ構築する必要があります。

4. カスタムコンポーネントを含むアプリを他の組織にアプリ配布で配布した場合、正常に開けますか?

はい、開けます。 カスタムコンポーネントを含むアプリを他の組織に配布した後、その組織でもコンポーネントを正常使用できますが、コンポーネントを更新することはできません。コンポーネントを更新するには、サービスプロバイダーがリモートメンテナンスの方法で配布済みのアプリのコンポーネントを新しいバージョンに再インストールする必要があります。コンポーネントが適切に抽象化されていれば、アプリ配布後にアプリを更新できないという要求の一部を解決することができます。

5. ページ内でカスタムコンポーネントの属性にアクセスする方法

カスタムコンポーネントは基本コンポーネントと同様に、this.$('fieldId').get('propName') を使用して対応するコンポーネントの属性を取得します。

6. ページ内でカスタムコンポーネントの属性を更新する方法

カスタムコンポーネントは基本コンポーネントと同様に、this.$('fieldId').set('propName', propValue) を使用して対応するコンポーネントの属性を更新します。 または、データソース変数バインドの方法を使用します。

7. コンポーネント内でページのコンポーネントを取得し、ページ内のコンポーネントと連携するには?

function 型の属性(イベントコールバック)をカスタムコンポーネントに追加します。 ページでこのイベントコールバックを通じて、ページの他のコンポーネントと連携できます。 コンポーネントでは、this.props.xxx() を通じて、コンポーネントの何らかのイベントやコンポーネントのDidMountなど適切なタイミングでこのコールバックを実行できます。 ヒント:function 型の属性にはデフォルト値を追加して非表示に設定することも可能です。

8. カスタムコンポーネントの削除方法

現在コンポーネントの削除はサポートしていません。削除すると複雑な依存関係問題が発生するため、現在は https://www.npmjs.com/ と似た形態になっています。

9. カスタムコンポーネントのアンインストール方法

現在コンポーネントのアンインストールはサポートしていません。コンポーネントをアンインストールすると既存のアプリケーションに影響を与えるため、今後のイテレーションでこの機能を検討します。

10. カスタムコンポーネントはサードパーティの NPM パッケージのインストールをサポートしていますか?

現在サポートしていませんが、動的にCDNリソースをロードする方法が使用可能です。

function loadScript(src, callback) {
if (!src) {
return;
}
const node = document.createElement('script');
node.src = src;
node.addEventListener('load', callback, false);
document.head.appendChild(node);
}
function loadCss(url) {
const linkElement = document.createElement('link');
linkElement.rel = 'stylesheet';
linkElement.href = url;
document.body.appendChild(linkElement);
}
(function loadAssets() {
loadCss('https://dev.g.alicdn.com/yida-platform/react-cropper/1.0.0/css/react-cropper.css');
loadScript('https://dev.g.alicdn.com/yida-platform/react-cropper/1.0.0/js/react-cropper.js', () => {
// your code
});
})();

11. コンポーネントをインストールしたが、パネルに表示されませんか?

A: インストール範囲を確認してください

12. カスタムコンポーネントはフォームでデータを送信するには?

A: 現在、宜搭のカスタムコンポーネントではフォームコンポーネントは開放されていません。データを送信したい場合は、既存のフォームコンポーネントにデータを埋め込む方法が使用可能です。例:一意識別子の属性を宣言し、使用時に既存のフォームの一意のフォームを渡し、コンポーネント側でイベントを通じて必要なデータを既存のフォームに書き戻します。

13. コンポーネントバージョン説明

コンポーネントは開発版正式版に分けられます。 宜搭のカスタムコンポーネントバージョンはセマンティックバージョニングの基礎の上で追加の約束事を設けています。

  1. 0.1.0 はデフォルトで開発バージョンであり、開発版はコンポーネントデザイナーとリアルタイム同期を維持し、コンポーネントのデバッグに使用できます。
  2. 1.x.x は発行後の正式バージョンであり、現在のバージョンの機能を固定し、オンラインでこのコンポーネントを使用する際の安定性を保証します。そのため、オンラインの正式アプリでは必ず1.x.xで発行された正式バージョンをインストールしてください。

14. 私が定義した属性があり、この属性を変更すると、コンポーネント内でこの属性に基づいて変化させるには?

コンポーネントデザイナー内で変化が必要なコンポーネントを見つけ、関連する属性を確認し、その属性に変数またはカスタム処理関数をバインドして、this.props.xxx を通じて判断し、異なる処理を行います。例: または

15. コンポーネント内でスタイルを動的に設定できますか?

コンテナコンポーネントを使用し、「カスタムスタイルクラス」をコンテナコンポーネントに追加し、変数バインドで制御します。

この文書は機械翻訳により生成されています。翻訳により生じた齟齬や相違点は拘束力を持たず、コンプライアンスや執行目的において法的効力はありません。
© DingTalk (Singapore) Private Limited