TS报错 /** * ! 报错问题 */ watch(() => state.todosList, saveTodos, { deep: true }); setup(props) { // reduce() 方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。 const count = computed(() => { return props.todosList.reduce((pre: number...
下拉框搜索 最近页面中需要一个下拉框,并且支持搜索功能(搜索选项文本和拼音),这是一个挺普通的小功能,代码如下: request.ts 先准备一些假的下拉框数据,并模拟请求: 图片 Index.vue 中进行请求,并渲染下拉框,配置一些属性,支持搜索选项文本: 图片 可以看到实现了搜索文本,但是产品说还得支持搜索拼音呢~可以看到当...
vue3+ts+element-plus使用下拉框时,部分值使用v-for循环出来,然后发现值是'',但下拉框不会渲染出来全部 {代码...} 如果在businessOptions里直接加上全部,就可以展示出来 {代码...} 但是这个值还得用在其他地...
"onReachBottomDistance":100,//距离底部100像素时,触发加载更多功能 } } ] 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 二、页面中使用下拉刷新功能和加载更多效果 import { onPullDownRefresh , onReachBottom } from "@dcloudio/uni-app" onPullDownRefresh(() => { console.log("下拉刷新") }) ...
model="item.priority"class="m-2"placeholder="请选择"style="width: 100px"><el-optionv-for="item2 in options":key="item2.value":label="item2.label":value="item2.value"/></el-select></template>//@ts-nocheck 解决ts类型报红 import { ref, onMounted } from 'vue'; import { Search...
项目是对一些vue3新语法的使用,以及对ts的使用,基本都是一些常用逻辑,主要学习了一些组件的封装, 以及将一些逻辑封装成hooks。自己来实现一些常见ui库的一些组件。 1.axios封装 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 axios.defaults.baseURL ="/api/api/";//配置默认url// 对请求做...
最近,在写vue3 + ts 项目,项目中使用技术点总结2 , 推荐收藏,供开发时使用 el-table的使用 显示checkbox <el-table-column type="selection"width="55"/> 2. 显示switch 开关 <el-table-column label="是否归属"width="240"><template #default="scope"><el-switchv-model="scope.row.isComm"inactive-...
import { ref, watch } from 'vue' import allAreas from '../lib/pca-code.json' //创建一个类型接口 interface TypeAreas { code: string name: string children?: Array<TypeAreas> } //所有数据 const allAreasList = ref(allAreas) //下拉框选择省份的值 const...
3.兼容ts 4.setup方法 从生命周期的角度来看:Setup --> beforeCreate --> created,所以突然有个疑问,搞这么多生命周期干嘛? 5. ref、reactive、toRefs的用法,不废话,见代码: setup(){constold=ref(0)constobj=reactive({name:'hhvcg',year:25})constchangeBtn=()=>{obj.year++obj.name=obj.name+'1'ol...
city"placeholder="请选择区域"v-model="area"> <el-option v-for="item in selectArea":key="item.code":value="item.code":label="item.name"></el-option> </el-select> </template> import {ref, watch }from'vue'import allAreasfrom'../lib/pca-code.json'exportinterfaceAreaItem{ name...