Ref
通过组合式API提供的ref函数
,可以使数据管理变得更加便利。说得通俗点,就是ref能够使我们在组件内更新这个值
import { ref } from 'vue'; const count = ref(0); const increment = () => {
count.value++;
};
以上定义了一个名为count
的ref
,并使用函数increment
递增他的值。
Computed
这个函数是API创建的计算属性
可以自动更新值。计算属性依赖于其他响应式数据,并且只有在依赖发生变化时才会重新计算值
import { ref, computed } from 'vue'; const count = ref(0); const squared = computed(() => count.value * count.value);
以上,定义了一个名为squared的计算属性,表示count的平方。
API的请求和异步
在Vue组件中进行API请求和管理异步操作时,可以使用像axios这样的库。
import axios from 'axios';
import {ref} from 'vue';
const fetchData = async () => {
try {
const response = await axios.get('https://api.example.com/data');console.log('Data:', response.data);
} catch (error) {console.error('Error fetching data:', error);
}
};
以上例子中,使用axios库进行了一个API请求,尝试检索数据,任何错误都被记录到控制台。