소품 변경 시 계산된 속성이 업데이트되지 않습니다.

소품 변경 시 계산된 속성이 업데이트되지 않습니다.

전달된 프로펠러 개체의 중첩된 속성이 변경된 경우 업데이트할 계산된 속성을 가져올 수 없습니다.

this.flash는 소품을 통해 전달되지만 이.flash에서는 계산된 속성이 업데이트되지 않습니다.selected Choices(선택사항)second.id 및 this.whttp://filename 을 참조하십시오.selected Choices(선택사항)first.id 가 변경되었습니다.

이걸 어떻게 반응시킬지 생각나는 거 없어?

계산된 속성은 다음과 같습니다.

isDisabled() {
  const hasMultipleChoices = this.favourite.choices.length
    ? this.favourite.choices[0].value.some(value => value.choices.length) : 
    false;

  if (hasMultipleChoices && !this.favourite.selectedChoices.second.id) {
    return true;
  } else if (this.favourite.choices.length && !this.favourite.selectedChoices.first.id) {
    return true;
  }

  return false;
}

테스트 완료

제 시험에서는요.표시하다

props: {
    variant: {
      type: String,
      default: ''
    }
}

const myComputedName = computed(() => {
  return {
    'yellow--warning': props.variant === 'yellow',
    'red--warning': props.variant === 'red',
  }
})

test.spec.discloss.discloses

    import { shallowMount } from '@vue/test-utils'
    import test from '@/components/test.vue'
    let wrapper
    
    //default values
    function createConfig(overrides) {
      let variant = ''
      const propsData = { variant }
      return Object.assign({ propsData }, overrides)
    }
    //test
    describe('test.vue Implementation Test', () => {
      let wrapper
    
      // TEARDOWN - run after to each unit test
      afterEach(() => {
        wrapper.destroy()
      })
      it('computed return red if prop variant is red', async (done) => {
        const config = createConfig({ propsData: { variant: 'red' } })
        wrapper = shallowMount(test, config)
        wrapper.vm.$nextTick(() => {
        //checking that my computed has changed, in my case I want to matchanObject
          expect(wrapper.vm.myComputedName).toMatchObject({
            'red--warning': true
          })
          //check what your computed value looks like
          console.log(wrapper.vm.myComputedName)
          done()
        })
      })

//TEST 2 Variant, this time instead red, lets say yellow

      it('computed return yellow if prop variant is red', async (done) => {
        const config = createConfig({ propsData: { variant: 'yellow' } })
        wrapper = shallowMount(test, config)
        wrapper.vm.$nextTick(() => {
        //checking that my computed has changed, in my case I want to matchanObject
          expect(wrapper.vm.myComputedName).toMatchObject({
            'yellow--warning': true
          })
          //check what your computed value looks like
          console.log(wrapper.vm.myComputedName)
          done()
        })
      })
    })

자세한 내용은 이 페이지를 참고해 주세요.

https://vuejsdevelopers.com/2019/08/26/vue-what-to-unit-test-components/

계산된 속성이 업데이트되지 않은 이유는 both.favorite의 id 객체를 생성했기 때문입니다.selected Choices(선택사항)두 번째랑 이거랑.selected Choices(선택사항)첫 번째, 컴포넌트가 렌더링된 후.렌더링 전에 id 개체를 선언하는 것이 해결책이었습니다.

언급URL : https://stackoverflow.com/questions/54090092/computed-property-not-updating-on-props-changes