开发笔记

Node多版本管理

关于ESLInk配置问题

Web调试入门

1. Vue 在导入组件时不能写{组件名},应该直接写组件名称。
2. 在自定义组件上，定义属性，属性前加:冒号，等于引用data里面定义的变量，不加冒号，就是把双引号里面的值，当作String，传过去。
3. 在自定义组件上，属性前添加@，表示，给自定义组件，添加，自定义事件的回调，例如click。

select下拉框默认选择问题

在下面一段代码中

<select value='2'>
  <option value="1">11</option>
  <option value="2">22</option>
  <option value="3">33</option>
</select>

在 Vue.js 中，这段代码 <select value="2"> 是无效的，因为 Vue.js 是一个用于构建用户界面的渐进式框架，它使用数据绑定和其它特性来简化视图与数据之间的交互。

在 Vue.js 中，如果你想要设置 <select> 标签的初始值，应该在 <select> 标签上使用 v-model 指令，并将它绑定到一个在 Vue 实例的 data 对象中的属性

<select v-model="selectedValue">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>

<script>
export default {
  data(){
      return {
        selectedValue: '2'
      }
    }
}
</script>

关于async 和 await

在调用网络时，如果使用async修饰方法，使用await调用网络请求时候，

封装的请求方法一定要return，不然即使写了await，还会继续执行await下面的逻辑。

例如，api/user.js

import request from '@/utils/request'

//注册
export const userRegisterService = ({ username, password, repassword }) =>{
    request.post('/api/reg', { username, password, repassword })
}
//由于这里换行了，忘记了return，在调用时，并没有等待结果

调用时

const register = async () => {
  await form.value.validate()
  console.log('校验通过')
  //发送注册请求
  await userRegisterService(formModel.value)
  ElMessage.success('注册成功')
  // 切换到登录
  isRegister.value = false
}

注意：会执行ElMessage.success('注册成功')

所以，我们需要修改api/user.js下的userRegisterService

import request from '@/utils/request'

//注册
export const userRegisterService = ({ username, password, repassword }) =>{
    return request.post('/api/reg', { username, password, repassword })
}