Блог

Главная - Вопросы по программированию - Как изменить шрифт кнопки формы шрифта?

Как изменить шрифт кнопки формы шрифта?

#reactjs #typeform

Вопрос:

У меня есть следующая форма ввода, встроенная в проект react:

 import { PopupButton } from '@typeform/embed-react'

const MyComponent = () => {
  return (
    <PopupButton id="<form-id>" style={{ fontSize: 20; fontFamily: "Helvetica" }} className="my-button">
      click to open form in popup
    </PopupButton>
  )
}

Однако, хотя изменение шрифта работает для моих дивов, оно не работает с компонентом PopupButton. Как я могу изменить шрифт «нажмите, чтобы открыть форму во всплывающем окне», содержащийся внутри?

Ответ №1:

PopupButton компонент позволит вам изменить CSS кнопки с помощью style prop.

В вашем случае у вас есть опечатка в объекте в style prop, он содержит точку с запятой ( ; ) вместо двоеточия ( , ) после fontSize . Когда вы используете двоеточие ( , ), это работает:

 <PopupButton id="<form-id>" style={{ fontSize: 20, fontFamily: "Helvetica" }} className="my-button">
  click to open form in popup
</PopupButton>

Я провел здесь быстрый тест, и он работает так, как ожидалось:
https://codesandbox.io/s/charming-shaw-92ber?file=/src/App.js

Метки: