avue中done()的作用

### Avue框架中 `done()` 函数的作用及用法 在Vue生命周期钩子以及某些异步操作场景下，`done()` 函数用于标记一个异步过程完成。当在一个方法内执行耗时较长的操作（如网络请求），为了防止组件提前销毁或其他逻辑错误，可以利用 `done()` 来通知Vue该异步流程已经结束[^3]。 对于Avue框架而言，在一些特定情况下也会涉及到类似的机制来处理复杂的表单验证、数据加载等异步事件。例如，在使用自定义插槽(Slot)时可能会遇到需要等待某个条件满足后再渲染的情况；此时就可以通过传递给回调函数的 `done` 参数告知父级组件何时继续后续工作[^2]。 下面是一个简单的例子展示如何在Avue中正确调用 `done()`： ```javascript // 假设这是配置项的一部分 { column: [ { label: '状态', prop: 'status', dicData: () => { setTimeout(() => { // 模拟获取字典列表的过程 return [{label:'启用',value:true},{label:'禁用',value:false}]; }, 1000); }, slot: true, span: 24, component: { props: { placeholder: "请选择" } }, render: (h, params) => { const { row } = params; // 使用 done 方法确保选项加载完毕再显示 this.$nextTick(() => { if (!row.statusOptionsLoaded){ avueUtils.getDictList('someApiEndpoint').then(res=>{ Object.assign(row,{ statusOptions: res.data }); row.statusOptionsLoaded=true; // 完成后调用 done() params.done(); }) }else{ // 如果之前已加载过，则立即完成 params.done(); } }); return h( 'el-select',{ props:{ value: row.status, disabled:!row.statusOptionsLoaded }, on: { change:(val)=>{ Object.assign(row,{ status: val }); } } }, row.statusOptions.map(item=> h('el-option',{props:item}) ) ); } } ] } ``` 在这个案例里，每当表格重新绘制某一行的时候都会触发一次 `render` 函数内的逻辑判断并尝试去拉取远程API接口返回的状态枚举值作为下拉框的内容源。而为了避免频繁发起不必要的HTTP请求，这里引入了一个标志位 `statusOptionsLoaded` 来记录是否曾经成功取得过对应的数据集。一旦确认所需资源均已就绪便会立刻调用传入到当前上下文环境下的 `params.done()` ，从而允许视图层正常更新界面元素。