Reactivity of my component

I'm having problems with the reactivity of my component. In this example, the 'currentCplId' variable inside the createEffect is always updated, but outside of it, it is not updated. Why? And how to fix it? Can someone help me?

import { pageStore } from '@store/index'
const Component = (props) => {
  const [ cpdId, setCplId ] = createSignal(pageStore.pageSettings.cplId)
  createEffect(() => {
    setCplId(pageStore.pageSettings.cplId)
    console.log(cplId())
  })
  console.log(cplId())
}

import { pageStore } from '@store/index'
const Component = (props) => {
  const [ cpdId, setCplId ] = createSignal(pageStore.pageSettings.cplId)
  createEffect(() => {
    setCplId(pageStore.pageSettings.cplId)
    console.log(cplId())
  })
  console.log(cplId())
}

import { pageStore } from '@store/index'
const Component = (props) => {
  const [ cpdId, setCplId ] = createSignal(pageStore.pageSettings.cplId)
  createEffect(() => {
    setCplId(pageStore.pageSettings.cplId)
    console.log(cplId())
  })
  console.log(cplId())
}

import { pageStore } from '@store/index'
const Component = (props) => {
  const [ cpdId, setCplId ] = createSignal(pageStore.pageSettings.cplId)
  createEffect(() => {
    setCplId(pageStore.pageSettings.cplId)
    console.log(cplId())
  })
  console.log(cplId())
}

Reactivity of my component

Similar Threads

Similar Threads

Similar Threads