1

React、ページが更新されるまでコンポーネントへのリンクが読み込まれ ない 利用規約のマイ リンクは、ページが更新されるまで読み込まれません ここの下のビデオをご覧ください。 https://youtu.be/2QumWBRXiuM

ここに Footer.js コードがあります ページへのリンクは 44 行目にある必要があります リスト (li) タグよりも link タグに入れています。

import React from "react";
// import { Button } from "./Button";
import "./Footer.css";
import { Text, Div, Button, Row, Col, Container, Image } from "atomize";
import logo from "../logo/tryb_logo_medium.png";
import { Link } from "react-router-dom";
import TwitterIcon from '@material-ui/icons/Twitter';
import FacebookIcon from '@material-ui/icons/Facebook';
import InstagramIcon from '@material-ui/icons/Instagram';
import { Icon } from "@material-ui/core";

function Footer() {
  return (
    <div className="main-footer" id="onTop">
      <Container>
        <Row d="flex">
          {/* Col 1 
          <div className="col-sm">
            <section className="footer-subscription">
              <p className="footer-subscription-heading">Join the Tryb</p>

              <div className="input-areas">
                <form>
                  <input
                    type="email"
                    name="email"
                    placeholder="Your email"
                    className="footer-input"
                  />
                </form>
                <p className="footer-subscription-text">
                  Unsubscribe at any time
                </p>
             <Button>Subscribe</Button> 
              </div>
            </section>
          </div> *}
          {/* Col 2 */}
          <Col textColor="white" size={{ xs: '12', md: '4' }}>
            <div text-align="center" p="1rem">
              <h4>Need Help?</h4>
              <ul className="list-unstyled">
                <a href="mailto:trybprints@gmail.com"><li>Contact Us</li></a>
                <Link to="/termsandconditions">
                <li>Terms &amp; Conditions</li>
                </Link>
              </ul>
            </div>
          </Col>

       
          {/* Col 4 */}
          <Col size={{ xs: '12', md: '4' }} align="center">
            <div p="1rem">
           
              <h4>Social</h4>
              <ul className="list-unstyled">
                <a href="https://www.facebook.com/trybprints" target="_blank" ><FacebookIcon/></a>
                <a href="https://www.instagram.com/tryb_prints/" target="_blank" ><InstagramIcon/></a>
                <a href="https://twitter.com/PrintsTryb" target="_blank" ><TwitterIcon/></a>
              </ul>
            </div>
          </Col>

             {/* Col 3 */}
             <Col size={{ xs: '12', md: '4' }}>
            <div p="1rem">
              <ul className="list-unstyled">
                <li> <img
                    src={logo}
                    alt="tryb logo"
                    width="300px"
                    className="d-inline-block align-top"
                /></li>
                <li></li>
              </ul>
            </div>
          </Col>
          
        </Row>
      </Container>
      <hr />
      <div className="copyright">
         Copyright &copy; Tryb Prints {new Date().getFullYear()}
      </div>
    </div>
  );
};

export default Footer;

どんな助けでも大歓迎ですありがとう

4

1 に答える 1