已解決430363個問題，去搜搜看，總會有你想問的

如何在道具驗證器中訪問“this”

首頁猿問如何在道具驗證器中訪問&ldquo...

如何在道具驗證器中訪問“this”

JavaScript

Helenr 2021-05-31 14:37:32

我正在使用 nuxt.js 處理一個項目，我正在按照官方文檔中的建議在應用程序的上下文中注入一個函數https://nuxtjs.org/guide/plugins/#inject-in-root-amp-context但是當我嘗試在 props 驗證中調用該函數時，我收到一個錯誤/plugins/check-props.jsimport Vue from 'vue'Vue.prototype.$checkProps = function(value, arr) { return arr.indexOf(value) !== -1}在組件 vue 中export default { props: { color: { type: String, validator: function (value, context) { this.$checkProps(value, ['success', 'danger']) } }}ERROR: 無法讀取未定義的屬性“$checkProps”有誰知道我如何在驗證中訪問“this”？

查看完整描述

2 回答

心有法竹

TA貢獻1866條經驗獲得超5個贊

Props 驗證是在組件初始化之前完成的，因此this您在擴展Vue.prototype.

形成他們的文件：

請注意，在創建組件實例之前驗證 props，因此實例屬性（例如數據、計算等）在默認或驗證器函數中將不可用。

一般來說，如果$checkProps只用于檢查這些 props 的值，我只會使用一個輔助函數。

// array.helpers.js

export function containsValue(arr, val) {

return arr.indexOf(value) !== -1

}

// component

import { containsValue } from 'path/to/helpers/array.helpers';

props: {

foo: {

validator(value) {

return containsValue(['foo', 'bar'], value);

}

更新

根據您的評論，如果您不想一遍又一遍地導入此特定功能，則可以Array.prototype.includes 查看文檔

// component

props: {

color: {

validator(value) {

return ['success', 'danger'].includes(value);

}

反對回復 2021-06-03

2 回答
0 關注
228 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何在道具驗證器中訪問“this”

如何在道具驗證器中訪問“this”

2 回答

添加回答