vue
117jf
这个作者很懒,什么都没留下…
展开
-
vue3 watch及watchEffect的使用和区别
watch 监听 ref 类型setup() { let val = ref(1); watch(val,(newValue, oldValue)=>{ console.log(`原值为${oldValue}`) console.log(`新值为${newValue}`) /* 1秒后打印结果: 原值为1 新值为2 */ }) // 1秒后将val值+1 setTimeout(() => { val.value ++ }, 1000)}wat原创 2022-02-18 16:42:31 · 109 阅读 · 0 评论 -
vue3 ref 获取单个Dom及多个Dom
获取单个Dom<input type="text" ref="inputRef" />setup() { const inputRef = ref(null) onMounted(()=>{ console.log(inputRef.value); })}获取多个Dom<div v-for="(item, index) in state.list" :key="index" :ref="setItemRef"> {{item}}</div>原创 2022-02-18 16:30:19 · 5011 阅读 · 1 评论 -
vue3 ref和toRef区别
<template> <div @click="change"> <div>{{newObj1}}</div> <div>{{newObj2}}</div> </div></template><script> import { ref, toRef } from 'vue' setup() { const obj = {name: '123123', age: 18原创 2022-02-18 15:48:14 · 399 阅读 · 0 评论 -
vuex基本使用( state, getters, mutations, actions, modules )
store/index.jsimport { createStore } from 'vuex'export default createStore({ // 这里的state就相当于组件中的data,就是专门用于保存共享数据的 state: { count: 0, todos: [], }, // 用于定义计算属性 getters: { doneTodos: (state) => { return state.todos.filter(todo => todo.原创 2022-02-11 14:19:23 · 618 阅读 · 0 评论 -
vue3 组合api的简单使用
//compostion api (组合api)import { ref, reactive, onBeforeMount, onMounted, onBeforeUpdate, onUpdated, onBeforeUnmount, onUnmounted, computed } from 'vue'export default{ setup(){ // 非响应式变量 let msg = "hello wrold"; // 响应式变量 let title = ref("h原创 2022-02-11 09:39:58 · 535 阅读 · 0 评论