소스 문제와 반응

어이 얘들 아. 이 시계가 사진과 함께 작동하도록 노력하고 있습니다. 나는 그 이상을 가졌지 만 내가 알아 낸 것을 얻을 수 있다면 나는 다른 것을 다룰 수있다. 많은 검색을 한 후에는 속성 내에서 문자열 보간을 사용할 수 없다는 것을 알았지 만, 계속 시도해 보았습니다. 두 번째는 "작동해야한다"고 생각하고 pic0, pic1 등의 변수를 보여 주지만 실제 모듈이 아닌 실제 모듈의 문자열입니다 (실제 응용 프로그램에서는 모두 가져 왔습니다. 하지만 질문에 간결을 삭감. 어떤 도움? 내 머리를 강타하고있어이는 src에 표시되지 않는 이미지가 "변수입니다 무엇을 내가보고 있어요입니다소스 문제와 반응

import React, { Component } from 'react'; 
import './App.css'; 
import './bootstrap-3.3.7-dist/css/bootstrap.min.css'; 
import pic0 from './0.png'; 

export default class Clock extends Component { 
    constructor(props) { 
    super(props); 
    this.incrementTime = this.incrementTime.bind(this); 
    this.dayInWords = this.dayInWords.bind(this); 
    this.state = { 
     clock: new Date(), 
     day: (new Date()).getDay(), 
     hours0: 0, 
     minutes0: 0, 
     seconds0: 0, 
     hours1: 0, 
     minutes1: 0, 
     seconds1: 0 
    } 
    } 


    componentWillMount() { 
    let intervalTimer = setInterval(this.incrementTime, 1000); 
    } 

    componentWillUnmount() { 
    clearInterval(this.state.intervalTimer); 
    } 

    incrementTime() { 
    this.setState(currentState => { 
     return { 
     clock: new Date(), 
     seconds1: ((new Date()).getSeconds())%10 
     }; 
    }); 
    } 
    render() { 
    return(
     <div className='panel-body imgContainer'> 
      <img src={pic0} alt='the digit 0' /> 
      <p>Know this one doesnt work but kept here to show I tried it</p> 
      <img src={`pic${this.state.seconds1}`} alt='seconds1' /> 

      <p>I think this should work and the src is what I want as the variable that im importing at the top but its just a string not the variable.</p> 
      <img src={'pic' + this.state.seconds1} alt='seconds1' /> 

      <p>This is the end goal im trying to accomplish but im trying to see if it can be done using this.state.seconds so its kind of "dynamic" and the source changes every second thus changing the image</p> 
      <img src={pic0} alt='seconds1' /> 
     </div> 
     ); 
     } 
    }

이 문제의 원인이 무엇 "메신저 상단에 가져하지만 내 용어 내가이에서 분명 아주 새로운 해요 잘못되면 실제로 미안 그 변수/모듈을 호출 아닙니다.

모든 도움에 감사드립니다 !!!! 이 비록

출처

2017-03-29 boomer1204

src = {'pic $ {this.state.seconds1}}}이 코드는 작동하지 않습니까? –

예상치 못한 토큰 오류가 아닙니다. 문자열 보간에 백틱을 사용하지 않지만 다시 틱을 사용하더라도 올바르게 "보간"하지 않습니다. – boomer1204

webpack에 번들로 제공 하시겠습니까? – JordanHendrix

이 게시물의 미래 방문자, 코멘트에 명확히했다 - 직접 가져온 이미지를 참조해야합니다

import pic from './myImage'; 

// works 
<img src={ pic } />

그것은 수있는 상태, 또는 다른 변수에 배치 할 수 있지만, 같은 이름의 문자열을 통해 액세스 할 수 없습니다.

// Doesn't work 
<img pic={ 'pic' } />

출처

2017-03-29 06:50:23

다시 한번이 점을 명확히 해 주셔서 감사합니다. Omri !!! – boomer1204

소스 문제와 반응

답변

관련 문제