問題タブ [svelte]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - Svelte カスタム メソッドでゲッター/セッターを使用する
カスタム メソッドで get/set ペアを使用すると、svelte コンポーネントをコンパイルできません。これはサポートされていませんか? それとも私は何か間違ったことをしていますか?
例:
名前を表示するコンポーネントが必要で、使用して名前を設定したいとします。
com.name = 'The new name';
ただし、名前にスペースが含まれていない場合にのみ、コンポーネントに名前を使用させたいと思います。
問題は、これをコンパイルしようとすると、重複したキーがあると表示されることです。
REPL はこちらです - https://svelte.technology/repl?version=1.13.2&gist=0eeab5717526694139ba73eae766bb30
これに関するドキュメントには何も表示されません。セッターを使用することはできませんが、使用できるようにしたいと考えています。
javascript - 複数のコンポーネントを js ファイルにロードしますが、必要なものだけを使用します
洗練されたフレームワークを使用してコンポーネントを作成する方法を学んでいます。しかし、js ファイルにロードしたコンポーネントから 1 つのコンポーネントのみのインスタンスを作成できませんでした。
だから、これは私のhtmlファイルです:
私のjs入力ファイル(コンポーネントをインポートする場所):
そして、コンポーネントの html:
したがって、この時点で、js 入力ファイルにインスタンスがあるため、コンポーネントがロードされます。現時点で、2 つ目のインスタンスが必要な場合は、js ファイル自体の 1 つを作成する必要があります。私は、必要なすべてのコンポーネントをjsファイルにインポートし、それらを使用したいhtmlファイルにインポートするだけのように考えていました。
これは可能ですか?ドキュメントを読んでいますが、必要なものが見つかりません。
編集:私もwebpackを使用していると言うのを忘れていました。したがって、入力ファイルと出力ファイル。複数のコンポーネントを使用することができました。私が見つけた解決策は、js入力ファイルでこれを行うことでした:
インポートしたオブジェクトをグローバル変数に入れて、次のように、必要な場所で呼び出すことができるようにします。
それでも、私はこの解決策を持っていますが、グローバルオブジェクトに依存することなく、js入力ファイルに一度だけインポートしてから、必要な場所で次のように呼び出すだけです。
React.js についてはあまり見たことがありませんが、プログラマーがこれを行っているのを一般的に見ている方法です。私は同じことを期待していました。それでも、他にやらなければならないことがあるので、後で最適化するために、今のところこのままにしておきます。
それでも、誰かがこれを行う方法を知っていれば、私はすべて耳です。私は Svelte を初めて使用し、ドキュメントを除いてあまり情報がないため、同じ部分で少し混乱していると思います.
svelte - トップレベルの <:Body> インジェクション?
次のコンポーネントがあるとします<TopLevelThing>
。
のトップレベルで使用することを意図しています<body>
。
<body>
ただし、トップレベルにはほど遠い、の奥深くにあるコンポーネントの一部として使用したい場合があります。
これは、次のような特別なタグで実現できます。
Svelte は、これを<body>
他の要素と並んでトップレベルに挿入します。ただし、コンポーネントのすべての機能 (ライフサイクル、プロパティ、およびコンポーネントの編成と構造の一部) は保持されます。
Svelteでこのようなことは可能ですか?
余談ですが、これは回避策で実現できると思いますが、具体的な機能があるのか どうか疑問に思っていました.
svelte - ダイナミック キード イーチ?
コンポーネント プロパティの値を使用して、キーを設定した各ブロックに動的キーを設定できますか?
例えば:
svelte - svelte コンポーネントに html 属性を自動的に渡す
svelte コンポーネントがすべての通常の html 属性をコンポーネント内の最上位の要素に自動的に適用できるようにすることはできませんか?
Component.html
アプリケーション.html
コンポーネント内の div に .extend を追加しましたか?
svelte - Sapper/Svelte で JavaScript ライブラリを使用するには?
Sappers のエクスポート機能を使用して静的サイトを構築し、Conversational FormやGSAPなどの JavaScript ライブラリを使用できるようにしたいと考えています。コンポーネントに追加しようとしても、オブジェクトclient.js
にアクセスできません。window
これにどのようにアプローチするのが最善ですか?
svelte - 実行時に Svelte テンプレートを動的にロードすることは可能ですか?
[<svelte:component>]
( here )のドキュメントを見てきましたがimport
、コンパイル時に可能なすべてのテンプレートを使用する必要があったようです。
Sveltefetch()
で、ユーザー アクションに基づく呼び出しなどから任意の数のテンプレートを読み込むことは可能ですか? 次に、それにデータを挿入しますか?
<slot>
初期ロード後に更新する予定がある場合、このようなものに使用するのは効率が悪いでしょうか?
svelte - Svelte で親メソッドを子に渡す
タイトルが示すように、親コンポーネントから子コンポーネントにメソッドを渡そうとしています。
例えば、
App.html
TodoItem.html
望ましい機能は、TodoItem がそのデータを使用して親のメソッドを呼び出すことです。
この例は壊れており、コンソール ログTypeError: this.options.data.toggle is not a function
.
svelte - Svelte: refs undefined
Svelte (v2.7) とSapper (v0.12)を使用しています。docsによると、this.refs
利用できるはずですが、それundefined
は私にとっては inoncreate
と custom メソッドの両方です。
私の index.html は次のようになります。
(完全なコードはこちら)。
これはバグではないと思います (そうでなければ、誰もがバグに遭遇したでしょうか?)。