Задать вопрос

TheOnlyFastCoder2

Ответы пользователя по тегу React

  • Почему electron не корретно запускается?

    @TheOnlyFastCoder2 Автор вопроса
    нужно добавить свойство transparent
    6186526d9e022809179401.png
    Ответ написан
    Комментировать
    Комментировать

  • Как правильно вызвать useState?

    @TheOnlyFastCoder2
    В ошибке сказано , что вы должно использовать useState только в функции 
    import React, { useState } from "react";

const MemoID = ({ getID }) => {
  return Array.from(new Array(getID)).map((_, i) => {
    return <p key={i}> {i} </p>;
  });
};

export default function App() {
  let [getID, setID] = useState(0);
  return (
    <>
      <MemoID key={getID} {...{ getID }} />
      <button onClick={() => setID(getID + 1)}> clickMe </button>
    </>
  );
}

    https://codesandbox.io/s/jolly-fermi-lioe7?file=/s...
    Ответ написан
    Комментировать
    Комментировать

  • Как создать универсальную кнопку?

    @TheOnlyFastCoder2
    Я не понимаю , зачем вам нужно менять местами ссылку с кнопкой , в чем смысл ?
    Я понимаю вы хотите сделать кнопку одну но для разных целей , но так не очень хорошо делать как по мне 

    //css
.submit.myStyles1 {
}
.submit.myStyles2 {
}
.submit.myStyles3 {
}


    const myfunction1 = () => {}
const myfunction2 = () => {}


const PhoneBTN = ({phone}) => (
  <a className="phone" href={`tel:${phone}`}>
    <img src="./Assets/Phone.svg" alt="" />
  </a>
)

const Button = ({type,text}) => {
  
  return (
    type === "phone" ? 
    <PhoneBTN {...{phone:text}} onClick={myfunction1}/>: 
    <button className="submit myStyles" onClick={myfunction2}>{text}</button> 
  )
} 

const render = () => (
  <Button {...{type:"phone",text:""}}/>
)
    Ответ написан
    Комментировать
    Комментировать

  • Как сгенерировать ссылку в React?

    @TheOnlyFastCoder2
    (Изменил ответ)
    //index.js
    import React from "react";
import { render } from "react-dom";

// import react router
import { BrowserRouter, Link } from "react-router-dom";
import toLinkParams from "./toLinkParams";

const params = {
  pathname: "/signup",
  search: toLinkParams({
    lang: "ua",
    source: "3",
    offer: 1,
    country: "ua"
  })
};

const App = () => (
  <BrowserRouter>
    <div className="sans-serif">
      <Link to={params}>Button</Link>
    </div>
  </BrowserRouter>
);

render(<App />, document.getElementById("root"));


    //toLinkParams.js

    export default function toLinkParams(params) {
  return (
    "?" +
    Object.entries(params)
      .map((param) => {
        const [key, value] = param;
        return `${key}=${value}`;
      })
      .join("&")
  );
}
    Ответ написан
    3 комментария
    3 комментария

  • Почему компонент рендерится дважды? Проблема в codesandbox?

    @TheOnlyFastCoder2
    Может быть вы хотели сделать что то подобное ? 
    import React, { useState } from "react";

export default function App() {
  let [getID,setID] = useState(0);
  return (
    <>
      <p> {getID} </p>
      <button onClick={ () => setTimeout(() => setID(getID + 1),800)} > clickMe </button>
    </>
  )
}


    или что то вроде этого 

    import React, { useState } from "react";

const MemoID = ({getID}) => {
  return Array.from(new Array(getID)).map( (_,i) => {
    return (<p key={i}> {i} </p>)
  })
}

export default function App() {
  let [getID,setID] = useState(0);
  return (
    <>
      <MemoID key={getID} {...{getID}}/>
      <button onClick={ () => setTimeout(() => setID(getID + 1),800)} > clickMe </button>
    </>
  )
}
    Ответ написан
    Комментировать
    Комментировать