問題タブ [tether]
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 - ブートストラップ 4 テザー配置
位置についてはtether.jsを使用するBootstrap 4ですが、「上」「右」「下」「左」の4つの位置しかサポートしていません.12のテザーをサポートするより多くのオプションに拡張するにはどうすればよいですか? たとえば、「左上」または「右上」
requirejs - Bootstrap 4 で使用するために Aurelia-CLI に Tether を追加する方法
Bootstrap 4をに追加しようとしていAurelia
ます。を機能させることしかできませんCSS
が、bootstrap.js
必要なTether
ものを含めることはできません。コンソールでこのエラーが発生し続けるためです。
私はこれに沿って何かを試しました
バンドルされていますが、まだ欠落していると不平を言っていTether
ます。 これで Tether requirejs.config.js` を作成する必要がある別のスタックの回答を読みましたavailable globally which could be done via
しかし、そのような構成はありませんAurelia
。
javascript - 反応仮想化リスト内のアイテム内の反応テザーのパフォーマンスの問題
説明
react-virtualized でレンダリングされるアイテムの潜在的に長いリストがありますVirtualScroll
。
リスト内の各項目 (行) にはかなりの量の要素があり、そのうちの 1 つがコンテキスト メニューを開きます。react-tether
HTMLでそのメニューをレンダリングしてbody
(アイテムがスクロール可能なリストの下部/上部にあるときに非表示にならないように)、ユーザーがリストをスクロールしている間、メニューをアイテムに「固定」したままにしようとしています.
私の問題は、テザー メニューの位置の更新に顕著な遅延があることです。
これまでに行った手順のいくつか:
- なしで単純なリストをレンダリングしました
VirtualScroll
。テザリングされたメニューはスムーズにレンダリングされ、目立ったジャンクはありませんでした. それが私が問題があると結論付けた方法ですreact-virtualized
- ここで推奨され
rowRenderer
ているように、メニュートリガーのみに簡略化しました。 shouldComponentUpdate
行コンポーネントに実装されています。これにより、認識されるパフォーマンスが大幅に改善され、遅延が大幅に減少しましたが、それでもまだ顕著です.- Chrome devtools のタイムラインを確認しました。
Grid.js
との両方によってトリガーされるリフローが表示されtether.js
ます。
ライブラリのバージョン:
- react-virtualized v. 7.24.3 (大規模なプロジェクトであり、8.x への移行はまだ準備ができていません)
- 反応テザー v. 0.5.2
- 反応するv。15.2.1
ワーキングデモ
https://plnkr.co/edit/f7OhCoCXkDsWbyjxhR3f
スクリーンショット:
javascript - ビューポートが変更されるまでテザー要素の位置が正しくありません
私は素晴らしいプラグインで遊んでいます:テザー
ブートストラップ (v3) ポップオーバーを手動でロードするときに問題が発生しました。ビューポートの外側のポップオーバーが、ビューポートの下部の間違った位置に表示されていました。そこで、代替手段としてこのプラグインを試すことにしました。
基本的なテザー オプションを使用して、フォームの入力の 1 つを検証しようとしましたが、フォームは laravel フォーム ビルダーを使用して作成されています。(form-group
入力の はターゲット要素です)。
問題:
しかし、何らかの理由で、ターゲット要素の左側 (不適切な位置) にロードされているようです。ビューポートが変更されると (ページのサイズ変更やスクロールなど)、ターゲット要素の右側 (正しい位置) に更新されます。
なぜこれを行うのかわかりませんが、これを正しい位置にロードする方法についてのアイデアはありますか?
例:
HTML:
ジャバスクリプト:
angular-cli - angular-cli@1.0.0-beta.24 で動作するようにテザードロップを設定する
angular-cli@1.0.0-beta.24 で作成した angular 2 アプリでテザードロップをセットアップする方法がわかりません。
再現する手順:
- angular-cli で新しいプロジェクトを作成します。
ng new tester --skip-git
- angular-cli の指示に従って、サードパーティ ライブラリをインストールします。
npm install tether-drop --save
npm install @types/tether-drop --save
- この時点で、app.component.ts で次の行を使用できることを完全に期待しています。
import { Drop } from 'tether-drop';
しかしng serve
、結果がこのエラーになると:
ERROR in ./src/app/app.component.ts Module build failed: Error: D:/Visual Studio Code/tester/src/app/app.component.ts (3,10): Module '"D:/Visual Studio Code/tester/node_modules/@types/tether-drop/index"' has no exported member 'Drop'.) at _checkDiagnostics (D:\Visual Studio Code\tester\node_modules\@ngtools\webpack\src\loader.js:116:15) at D:\Visual Studio Code\tester\node_modules\@ngtools\webpack\src\loader.js:141:17 @ ./src/app/app.module.ts 14:0-47 @ ./src/main.ts @ multi main
サードパーティのライブラリを angular-cli で生成されたプロジェクト (webpack) に統合するのに非常に苦労しました。私はそれらのいくつかを機能させることができましたが、これに対する解決策は私をほのめかしています。
誰かが私を啓発し、この無知の重荷を私から取り除くことができますか?