한 가지 방법은 Vue 3에서 제공하는 watchEffect 함수를 사용하는 것입니다. 이 함수는 함수인 하나의 매개변수를 받습니다. 이 함수에는 응답해야 하는 변수가 포함되어 있습니다. 이러한 변수가 변경되면 watchEffect 함수가 자동으로 이 함수를 트리거합니다. 예:
import { watchEffect } from 'vue' watchEffect(() => { // 需要响应的变量 console.log('变量发生变化了') })
위의 예에서는 watchEffect 함수를 사용하여 변수를 관찰합니다. 변수가 변경되면 콘솔에 "변수가 변경되었습니다."가 출력됩니다.
다음으로 watchEffect 함수에서 Ajax 요청을 보낼 수 있습니다.
import { watchEffect } from 'vue' import axios from 'axios' watchEffect(() => { // 需要响应的变量 axios.get('/api/data') .then(response => { // 处理响应的数据 }) })
위의 예에서 응답 변수가 변경되면 watchEffect 함수의 코드가 자동으로 실행되어 Ajax 요청을 보내고 응답 데이터를 처리합니다.
Vue 3에서는 watchEffect 기능 외에도 watch 기능도 제공합니다. watch 함수는 두 개의 매개변수를 받습니다. 첫 번째 매개변수는 모니터링해야 하는 변수이고, 두 번째 매개변수는 변수가 변경될 때 실행해야 하는 콜백 함수입니다. 예:
import { watch } from 'vue' import axios from 'axios' watch( // 监听的变量 () => data.value, // 变量发生变化时执行的回调函数 (newValue, oldValue) => { axios.get('/api/data') .then(response => { // 处理响应的数据 }) } )
위의 예에서 data.value 변수가 변경되면 watch 함수는 자동으로 콜백 함수를 실행하고 Ajax 요청을 보내고 응답 데이터를 처리합니다.
위 내용은 Vue3에서 데이터가 변경되면 자동으로 요청을 발행하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!