【二】鸡汤来咯开发学习笔记-29

1.在edit中加入提交鸡汤时的加载属性和提交时内容编辑组件无法使用

import { ref } from 'vue';
import { showToast } from '../../utils/common';
import { stripHTML } from '../../utils/tools';
const db=uniCloud.database()  //相当于链接云数据库
const formDate =ref({
    soup_type:0,
    content:"",
    from:"",
})
const disabled =ref(false);     //此变量由上面页面组件进行绑定
const radioChange = (e)=>{
    formDate.value.soup_type=Number(e.detail.value);
}
const onSubmit =async() =>{
    disabled.value=true;
    uni.showLoading({       //先加载后面的hide再隐藏，然后先disabled生效，后面失效
        title:'提交中'
    })
    formDate.value.content =stripHTML(formDate.value.content);
    if(formDate.value.content===""){
        return showToast("鸡汤内容不能为空")
    }
     
    let res =await db.collection("soup-chicken").add(formDate.value)
    console.log(res);
    uni.hideLoading();
    disabled.value=false;
}

绑定disabled

:disabled="disabled"

2.使用try catch 来获取错误，进行提示，再把res进行解构为{result：{errCode}}，这个要根据返回值来进行借构，因为这里我们需要errcode来进行判断是否提交成功

try {
    disabled.value = true;
    uni.showLoading({
        title: '提交中'
    })
    formDate.value.content = stripHTML(formDate.value.content);
    if (formDate.value.content === "") {
        return showToast("鸡汤内容不能为空", "none", false)
    }

    let {
        result: {
            errCode
        }
    } = await db.collection("soup-chicken").add(formDate.value)
    if (errCode === 0) {
        showToast("发表成功", "success") //success是那个图标，细看方法common。js里面
    }
} catch (e) {
    showToast(e.errMsg, "error")
}
uni.hideLoading();
disabled.value = false;

}