Vueが種類をパッケージ化し、アプリケーションで使用されるJS

VUEクラスパッケージに同じプロパティまたはメソッドの複数のインスタンスを作成するために使用することができます。例としては、データの整合性を保証するために、均一な特性及びメソッドを有するものです。コードはよりシンプル、オブジェクトのみにパラメータを渡す必要があります。
例えば、以下の要件(1)があります。

  1. クラスA、番号ID、名前、名前、種の種類、画像のURLを含める必要があります。
export default class A {
	constructor(id, name, type, url){
		this.id = id
		this.name = name
		this.type = type
		this.url = url
	}
}
  1. クラスを追加する方法、追加情報)(例GETINFO非同期IDに従って得ることができます。
export default class A {
	constructor(id, name, type, url){
		this.id = id
		this.name = name
		this.type = type
		this.url = url
	}
	getInfo() {
		return axios.get(url, { id: this.id }).then((res) => {
			this.info = res.data.info
		}).catch((err) => {
			this.info = ''
		})
	}
}
  1. プロセスデータ、createa(paramsは)を露光する方法に必要外部に、クラスAのインスタンスを作成するために使用される場合、オブジェクトパラメータparamsは、非構造化データです。書かれたcreateA後、Aのインスタンスを作成した後createA機能によって作成されます。

    データなし処理した場合、直接新しいA(のparams)が使用され

export function createA(params) {
	return new A({
		id: params.id,
		name: params.name,
		type: params.type,
		url: `http://test.test.test.com/${params.id}`
	})
}
  1. 使用法:_normalizeList(リスト)リスト全体のシーケンス。機能が複雑されていない場合や、直接のインスタンスcreateA(アイテム)を作成するために使用することができます。
_normalizeList (list) {
   let ret = []
   list.forEach(item => {
     if (item.id) {
       ret.push(createA(item))
     }
   })
   return ret
 }

時間がより多くの情報を得るために必要な、そのGETINFO()メソッドを呼び出します。

console.log(a.info) // ''
this.a.getLyric()
console.log(a.info) //data

https://github.com/Gesj-yean/vue-demo-collection文書の使用より優れたプラグイン。学生はどうもありがとうございましたことができ、私の一番上のブログを見て時間を持っています。

公開された27元の記事 ウォンの賞賛4 ビュー2820

おすすめ

転載: blog.csdn.net/qq_39083496/article/details/104259332