Our goal is to activate a query when a string reaches a length of 3 characters or more, and keep it activated once triggered. Leveraging the Vue 2 Composition API, we have implemented a reactive object to manage the status of queries:
import { computed, defineComponent, reactive, ref } from '@vue/composition-api'
export default defineComponent({
setup() {
const truckId = ref<string>('')
const driverId = ref<string>('')
const queryEnabled = reactive({
driver: false,
truck: false,
})
To set queryEnabled.driver to true when driverId exceeds 3 characters in length, you can utilize this method:
const queryEnabled = reactive({
driver: computed(() => driverId.value.length >= 3),
truck: false,
})
While this approach enforces activation, it also reverts queryEnabled.driverto false if the string shortens. How can we maintain the value as true without reverting back? Is it possible to achieve this within just one computed property in the reactive object? I've contemplated using a function instead of an arrow function to access this, but have yet to find a solution.