子ページから親ページにデータを渡す

今日、私はvueベースのシステム管理者の承認分割関数を書いてみましょう、最初は私は本当に困難だった、非常に悲しい、コードのこの作品は非常に混乱しているため、関数も非常にどのように言うために、実際には、顧客の需要はまだOKですが、唯一の元のコード変換から、非常に嫌です。

vueの親子パス（実際には単なる3つの軸）についての理解が深まりました。

父から息子へ：

は、親ページ

 <adminList ref="addModule"
 @func="getmessage" ></adminList>
import adminList from './set-as-admin-list'
components: {
 adminList
 },

メソッドの中で、this.$nextTick(を確認してください。

なぜなら、この場所はサブコンポーネントの遅延ロードメソッドに相当するからです。

Vueの親コンポーネントの参照子コンポーネントのメソッド表示が未定義の問題の原因と解決策

this.$nextTick(() => {
 this.$refs.addModule.init(this.struId, this.organId, false)
 })

ここで$refs.addModuleは、domの操作、つまりメソッドや値のサブコンポーネントの操作に相当します。

サブページ

 init (struId, organId, isAdmin) {
 debugger
 this.isAdmin = isAdmin
 this.struId = struId
 this.organId = organId
 this.getPersonList(struId)
 },

上記は親ページのstruId、organId、falseを子ページに渡し、ついでに子ページのメソッドを呼び出しています。

また、ref="異なる値 "を除いて、親ページで同じコンポーネントを複数回使用することが可能であることは注目に値します。

親ページ

 <adminList ref="authorizationModal"
 @func="getmessage" ></adminList>

息子から父親へ：

それもシンプルに。

サブページ

メソッドでは

this.$emit('func', data)

親ページは

<adminList ref="authorizationModal"
 @func="getmessage" ></adminList>

func は渡すキーです。

値は "getmessage "で受け取ります。

 getmessage (data) {
 this.authorizationVisible = data
 },

これは子ページから親ページにデータを渡します。