Этот плагин использует параметры, которые вы передаете первому элементу, созданному вами для создания элементов VUE.
Он передает объект стиля параметру стиля, когда Stripe создает элементы .
Передает свойство elements
в функцию элементов Stripe .
. Здесь можно добавить объект CustomFontSource .
Обратите внимание, что, как и в этом примере, если вы хотите использовать шрифт Google, вам нужно go ввести указанный URL и захватить URL в дескрипторах @fontface. Возможно, вам лучше будет разместить шрифт самостоятельно, так как я боюсь, что эти URL-адреса могут со временем меняться.
stripeOptions: {
elements: {
fonts: [{
family: 'Lexend Deca',
src: 'url(https://fonts.gstatic.com/s/lexenddeca/v1/K2F1fZFYk-dHSE0UPPuwQ5qnJy_YZ2ON.woff2)',
unicodeRange: 'U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD',
style: 'normal',
weight: '400',
display: 'swap',
}],
},
style: {
base: {
color: 'red',
fontFamily: '"Lexend Deca", sans-serif',
fontSize: '18px',
fontWeight: '400',
fontSmoothing: 'antialiased',
},
},
},
Компоненты Stripe:
<card-number
:stripe="stripeId"
:options="stripeOptions"
/>
<card-expiry
:stripe="stripeId"
:options="stripeOptions"
/>
<card-cvc
:stripe="stripeId"
:options="stripeOptions"
/>