CODEWITHSUNDEEP
javascriptreactjs
MontaKr
MontaKr

Reputation: 155

There is a problem with implementing the map function of react

I'm sorry to ask you a simple question first. But I don't know where to fix it. I wanted to create an array of characters like a picture, so I used the map function and array, but I can't apply which part of the code is wrong. Can I know which part is wrong and how to change it? Thanks.

enter image description here

Footer.jsx: this is the file I used map function and array

const array = [
  'Meta', '소개', '블로그', '채용 정보', '도움말', 'API', '개인정보처리방침', '약관', '인기 계정', '해시태그', '위치', 'Instagram Lite', '연락처 업로드 & 비사용자'
]

function Footer() {
  return (
    <FooterWrap>
      <div className='FooterWrap2'> 
        <div className='FooterContent1'>
          <div className='FooterContent1Wrap'>
            {array.map((text, idx) => {
              return (
                <div>
                  <a>
                    <div>
                      {text}
                    </div>
                  </a>
                </div>
              )              
            })}
          </div>
        </div>
        <div className='FooterContent2'>

        </div>
      </div>
    </FooterWrap>
  )
}

export default Footer;

Upvotes: 0

Views: 33

Answers (1)

KcH
KcH

Reputation: 3502

Why not just use a tag and its href pointing to it's link

{array.map((text, idx) => {
          return (               
              <a href="add_url_here" key={text}>
               {text}
              </a>
          )              
  })}
  • If you have styling issues, you can add a codesandbox link, save code and share so one can look in to it

Upvotes: 1

Related Questions