[TIL] 0129
7923 ワード
storybook refactoring文書はapiからのデータの山を提供し、apiからのデータの山ではない. argsはpropsにコントロールを追加するために使用され、コントロールが必要ない場合はpropsのように挿入できます. export defaultと定義されたargtypesはすべての物語の共通点であり、args に入る.
2つ以上のバージョンのが必要な場合は、テンプレートを作成しargを個別に指定します.
->他の重複コード(寸法)を記述する必要はなく、propsを作成するだけなので、 物語の本と槍の理由が分かりました.小単位の素子も純粋な支柱ではなく、外部の影響を受ける(api,context).マニュアルを作成するには、純粋なコンポーネント である必要があります.ですが、各ページに1つの要素が深く入り込む必要があります.この場合、パッケージ要素 が作成する. wrappedは、contextおよびapi関数を受信し、実行コードを宣言し、LikeToggleにログインしたユーザおよびapi関数をpropsとしてユーザ に渡す.ストーリーブックに書かれている場合は、ログインの有無をpropsに設定し、onClick関数(API)を渡さずに済みます
https://kciter.so/posts/effective-atomic-design コンテキストでサーバ が要求するかどうかを検証する.を試した指導者に質問 TypeScript Project
実施第第2項RandomQuotes 構造関数の実行文の順序が少し混乱している this.renderが実行されるとmountも一緒に実行され、buttonでイベントハンドラ関数が保留されるとthisになります.quoteとthis.作者未発表の状態 コールバック関数は、実行前に実行コードが有効かどうか分からないようです.
2つ以上のバージョンの
->他の重複コード(寸法)を記述する必要はなく、propsを作成するだけなので、
https://kciter.so/posts/effective-atomic-design
実施第
constructor($target: Element) {
// 실행 순서가 궁금해짐 = 콜백함수는 실행되기 전까지는 실행코드가 유효한지 모른다
super($target);
this.render();
this.$quote = document.querySelector('.quote'); // 비효율적인건가??
this.$author = document.querySelector('.author');
this.handleClickButton();
}
async handleClickButton() {
// api실행
const { data } = await axios.get('https://free-quotes-api.herokuapp.com/');
this.$quote.innerHTML = `"${data.quote}"`;
this.$author.innerHTML = data.author ? `- ${data.author}` : '';
}
mount() {
// 왜 constructor에서 가져오면 안될까?? - 이벤트 거는게 먼저라서(mount함수가 먼저 실행)..
const $button = document.querySelector('.change_button');
$button?.addEventListener('click', () => {
this.handleClickButton();
});
}
render() {
this.$target.innerHTML = '';
this.$target.innerHTML = this.template();
this.mount();
}Reference
この問題について([TIL] 0129), 我々は、より多くの情報をここで見つけました https://velog.io/@yooon26/TIL-0130テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol