問題タブ [carbon-design-system]

カーボン デザインを使用して反応アプリを作成しようとしています。

ここで、HeaderName の「to」属性はページをサブオブジェクトとして URL にルーティングします。タグには独自の閉じるボタンがあり、閉じるボタンがクリックされると「onClose」イベントがトリガーされます。

問題: タグの閉じるボタンをクリックすると、ページが再び「/campaigns」にルーティングされ、すべての状態が削除され、ビジネス ロジックに影響します。

カーボン デザイン チャートの反応ライブラリを使用してgetFillColorいますが、チャート オプション プロパティの関数を使用してカスタム カラーを設定するのが困難です。

上記のコードは v0.40.2 以下で動作します。このサンドボックスをチェックアウトすると、色が正しく設定されます。

ただし、v0.40.3 以降では機能しなくなりました。このサンドボックスを参照してください。色は変更されていません。

カーボンデザインチャートフレームワークで色を設定する正しい方法は何ですか?

最近、次のツールを使用して簡単な Web アプリの構築を開始しました。

1. Vue.js
2. カーボンデザインシステム

次のステップは、メーリング リストを含めることです。テキスト ボックスと購読ボタンの 2 つのコンポーネントを含む単純なフォームを追加したいと考えています。

私はバックエンドにとらわれず、MailChimp または SendGrid の使用を検討しています。ただし、次の問題に遭遇します。MailChimp と SendGrid の両方で、ユーザーは Web ページにコピーできる HTML でカスタム フォームを生成できます。問題は、スタイルがカーボン デザイン システムと一致しないことです。たとえばcv-button、標準の代わりに公式のコンポーネントを使用したいと思います。button

この問題に対処するために、2 つのアプローチを試みました。まず、CSS のスタイリングをいじりました。私の Carbon Design System は css の代わりに scss を使用しており、このフォームだけにカスタム css を設定すると、必然的に将来的に一貫性のないデザインにつながるため、これは進むべき道ではありません。

次に、MailChimp API と SendGrid API の両方を直接操作してみました。しかし、これは退屈で時間のかかる作業です。さらに、それはプロジェクトに多くの複雑さをもたらします。

私の質問: ノード js (vue.js) アプリとサード パーティのメール マーケティング ソリューション (mailchimp / sendgrid) にカスタム デザイン システムと一致するサブスクリプション ボタンを含める場合のベスト プラクティスは何ですか。

これは私の現在のmailchimpコードです:

それは次のようにレンダリングされます：

これは、cv-button などの公式 Carbon コンポーネントのスタイルとは異なります。

カーボン デザイン チャートの反応ライブラリを使用していますが、「カーボン チャートの CSS スタイルがありません」という断続的なエラーが発生します。Carbon Charts 入門ガイドをお読みください。'

index.jsにインポートされたapp.scssにcssをインポートしています。@import '~@carbon/charts/styles.css';

localhost でコードを実行すると機能しますが、npm build でコードをビルドすると、このエラーが発生することがあり、ページ全体が空白になります。

また、コンポーネントファイルのcssにインポートしようとしました, import '@carbon/charts/styles.css';