admin管理员组

文章数量:1031887

I create the component with the phone number

const PhoneNumber = () => {
  return (
    <div>123-456-7890</div>
  )
}

and I add it in href

<a href="tel: 123-456-789" title="Phone Number" className="transition"><PhoneNumber/></a>

how can I add in href="tel:123-456-789"

I create the component with the phone number

const PhoneNumber = () => {
  return (
    <div>123-456-7890</div>
  )
}

and I add it in href

<a href="tel: 123-456-789" title="Phone Number" className="transition"><PhoneNumber/></a>

how can I add in href="tel:123-456-789"

  • reactjs
Share Improve this question asked Nov 16, 2024 at 6:09 Nazar KardanNazar Kardan 651 silver badge5 bronze badges
Add a comment  | 

1 Answer 1

Reset to default 0

Let me explain about your problem. You can change your code as my sample below

import React from 'react';

const PhoneNumber = ({ number }) => {
  return (
    <div>{number}</div>
  );
};

export default PhoneNumber;

Code for the component

import React from 'react';
import PhoneNumber from './PhoneNumber';

const App = () => {
  const phoneNumber = "123-456-7890";

  return (
    <div>
      <a href={`tel:${phoneNumber}`} title="Phone Number" className="transition">
        <PhoneNumber number={phoneNumber} />
      </a>
    </div>
  );
};

export default App;

Code for the main functions. With my samples you can assign your phone number dynamic rather than static.

I create the component with the phone number

const PhoneNumber = () => {
  return (
    <div>123-456-7890</div>
  )
}

and I add it in href

<a href="tel: 123-456-789" title="Phone Number" className="transition"><PhoneNumber/></a>

how can I add in href="tel:123-456-789"

I create the component with the phone number

const PhoneNumber = () => {
  return (
    <div>123-456-7890</div>
  )
}

and I add it in href

<a href="tel: 123-456-789" title="Phone Number" className="transition"><PhoneNumber/></a>

how can I add in href="tel:123-456-789"

  • reactjs
Share Improve this question asked Nov 16, 2024 at 6:09 Nazar KardanNazar Kardan 651 silver badge5 bronze badges
Add a comment  | 

1 Answer 1

Reset to default 0

Let me explain about your problem. You can change your code as my sample below

import React from 'react';

const PhoneNumber = ({ number }) => {
  return (
    <div>{number}</div>
  );
};

export default PhoneNumber;

Code for the component

import React from 'react';
import PhoneNumber from './PhoneNumber';

const App = () => {
  const phoneNumber = "123-456-7890";

  return (
    <div>
      <a href={`tel:${phoneNumber}`} title="Phone Number" className="transition">
        <PhoneNumber number={phoneNumber} />
      </a>
    </div>
  );
};

export default App;

Code for the main functions. With my samples you can assign your phone number dynamic rather than static.

本文标签： reactjsAdd dynamic phone Number in reactStack Overflow

版权声明：本文标题：reactjs - Add dynamic phone Number in react - Stack Overflow 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://it.en369.cn/questions/1745664450a2162093.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。