calin24
calin24

Reputation: 981

change computed based on another computed in vue 3

I have this in vue 3. I need to change the title using the prop id if is 0 should be 'New' else 'Details' based on another computed property that I have editMode

setup(props) {
  const {id} = toRefs(props)
  const editMode = computed(() => {
    return id.value !== 0
  })
  const title = computed(() => {
    return editMode ? 'Details' : 'New'
  })
}

the problem is when editMode is false the title is not changing ..... remains 'Details' all the time.

Any idea ?

Upvotes: 8

Views: 6377

Answers (1)

gengar.value
gengar.value

Reputation: 258

I think you need to alter editMode to editMode.value inside title compute, given editMode also belongs to Ref type.

const title = computed(() => {
  return editMode.value ? 'Details' : 'New'
})

This should simply solve your problem.

Also try console.log(typeof id.value) to ensure String '0' and Number 0 are not mixed up.

Upvotes: 11

Related Questions