Vuejs 문자열 형식이 올바르게 작동하지 않음

Vuejs 문자열 형식이 올바르게 작동하지 않음

안녕하십니까? VueJs에서 역동적으로 div를 스타일링하려고 노력중 입니다.그러나 이 문제에 직면하여 이.currentProgressLevel이 currentStyle 객체 내부의 폭 속성에 적용되지 않는다.내가 사용하고 있는 코드의 스크린샷을 첨부한다.*${this.currentProgressLevel 75}px 사용 시 너비 속성이 작동하지 않는 이유수동으로 0.33으로 이.currentProgressLevel을 변경하면 작동하지만 하드 코딩이 되는데 데이터 변수 currentProgressLevel에서 값을 가져오지 않는 이유는?다음은 사용 중인 코드:

스크립트:

data(){
return{
currentProgressLevel:.33,
currentStyle:{
width: ${this.currentProgressLevel *75}px ,
height:‘6px’,
background:‘green’
}
}}

돌아야 한다.currentStyle로computed다음과 같은 경우:

computed: {
  currentStyle () {
    return {
      width: `${this.currentProgressLevel *75}px`,
      height:‘6px’,
      background:‘green’
    }
  }
}

반응형 데이터의 경우 'currentStyle'을 계산으로 이동하십시오.이 경우 'currentProgressLevel'의 초기 값을 잡기만 하면 된다.

computed:{
  currentStyle(){
    return {
      width: ${this.currentProgressLevel *75}px ,
      height:‘6px’,
      background:‘green’
    }
  }
}

참조URL: https://stackoverflow.com/questions/64729714/vuejs-string-formatting-not-working-correctly