vueの原理を学び、自己要約をしたいと思います。
参考記事：
Vue.jsテクノロジーの秘密：非常に詳細で、入門的な必要があります
-読む必要があります-vue依存関係収集の原則の詳細な接続：より多くの例、高度なチュートリアル
vueソースコードからのオブザーバーモード：スキルが不十分で、一時的にvueソースコードを統合できません
。詳細分析：スキルが不十分で、一時的に統合できません
vueの依存関係のコレクションは、depとwatcherに関連しています。
dep：依存関係の略語。これは、依存関係とオブザーバーモデルのサブスクライバーの概念を意味します。
ウォッチャー：オブザーバーの意味
入門
はじめに上記の最初の記事を読むことを強くお勧めします。しかし、調和の統合と独自の知識システムの形成は、それがほとんど無意味であると常に感じています。
私は最初に始めた私の経験を書き留めます。
難しさ：
addDep (dep: Dep) {
const id = dep.id
if (!this.newDepIds.has(id)) {
this.newDepIds.add(id)
this.newDeps.push(dep)
if (!this.depIds.has(id)) {
dep.addSub(this)
}
}
}
- addSubは、データが変更されたときに通知するために、現在のウォッチャーをサブに追加します。
- newDepidとdepid、newDepとdepが交換されるため、depにidがある限り、subにウォッチャーが存在する必要があります。depにIDがない場合、subはウォッチャーを追加します。depとnewDepを交換すると、depにIDがある限り、subにウォッチャーが存在することが保証されます。
難易度2：
let i = this.deps.length
while (i--) {
const dep = this.deps[i]
if (!this.newDepIds.has(dep.id)) {
dep.removeSub(this)
}
}
-
これが交換前の最後のステップです
-
交換の前に、部門はすでにウォッチャーを持っている可能性があります
-
depはあるがnewDepがない場合、現在の依存関係コレクションはこのウォッチャーに通知する必要がないため、サブから削除されます。
総括する
始めたような気がしますが、実際の戦闘はまだ不足しており、統合の意味もまだ不足しています。私はソースコードをもう一度研究し、この記事を改善し続けます