未捕获的类型错误:无法在 updateTimer (VM277 index.js:17) 处设置 null 的属性“innerHTML”

时间:2021-01-15 11:48:53

标签: javascript

我使用 java 脚本在网页上添加了一个倒数计时器,但是当我重定向到其他页面时,我的控制台每秒都会出错:未捕获的类型错误:无法在 updateTimer(VM277 索引. js:17) at :1:1 ,如何解决

function updateTimer() {
    future = Date.parse("dec 31, 2021 11:30:00");
    now = new Date();
    diff = future - now;

    days = Math.floor(diff / (1000 * 60 * 60 * 24));
    hours = Math.floor(diff / (1000 * 60 * 60));
    mins = Math.floor(diff / (1000 * 60));
    secs = Math.floor(diff / 1000);

    d = days;
    h = hours - days * 24;
    m = mins - hours * 60;
    s = secs - mins * 60;

    document.getElementById("timer")
        .innerHTML =
        '<div>' + d + '<span>days</span></div>' +
        '<div>' + h + '<span>hours</span></div>' +
        '<div>' + m + '<span>minutes</span></div>' +
        '<div>' + s + '<span>seconds</span></div>';
}
setInterval('updateTimer()', 1000);

我用过反应

import React from 'react';
import Button from '@material-ui/core/Button';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import { Link, Redirect } from 'react-router-dom';
import ScriptTag from 'react-script-tag';

const Landing = ({ isAuthenticated }) => {
  if (isAuthenticated) {
    return <Redirect to='/dashboard' />;
  }
  return (
    <div>
      <section className='landing'>
        <div className='dark-overlay'>
          <div className='landing-inner'>
                **<div id="timer"></div>
          <ScriptTag type="text/javascript" src="/index.js" />**
            <h1 className='x-large'>xyz</h1>
            <p className='lead'>
             xyz 
            </p>
            <div className='button'>
              <Button variant='contained' color='primary' href='Register'>
                Sign Up
              </Button>
              <Button variant='contained' color='secondary' href='Login'>
                Login
              </Button>
            </div>
          </div>
        </div>
      </section>
    </div>
    
  );
};

Landing.propTypes = {
  isAuthenticated: PropTypes.bool,
};

const mapStateToProps = (state) => ({
  isAuthenticated: state.auth.isAuthenticated,
});

export default connect(mapStateToProps)(Landing);

0 个答案:

没有答案