账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    vue 获取数据为什么获取不到已经更新的数据?
    22
    0

    1.去后台获取数据,可以获取的到。
    2.之后在提交数据(更新表单),确认表单数据提交上去了。在获取数据,获取不到已经修改的数据,这是为什么?

    这是表单:

    <el-dialog title="修改个人资料" :visible.sync="personalDetailVisible">
      <el-form :model="personalForm" :rules="personalFormRules" ref="ruleForm2">
        <el-form-item label="用户名" prop="personUserName">
          <el-input v-model="personalForm.personUserName" :disabled="true"></el-input>
        </el-form-item>
    
        <el-form-item label="QQ" prop="qq">
          <el-input placeholder="请输入QQ号" v-model="personalForm.qq"></el-input>
        </el-form-item>
    
        <el-form-item label="微信" prop="weixin">
          <el-input placeholder="请输入微信号" v-model="personalForm.weixin"></el-input>
        </el-form-item>
    
        <el-form-item label="手机" prop="cellphone">
          <el-input placeholder="请输入手机号" v-model="personalForm.cellphone"></el-input>
        </el-form-item>
    
        <el-form-item label="邮箱" prop="email">
          <el-input placeholder="请输入邮箱" v-model="personalForm.email"></el-input>
        </el-form-item>
    
        <el-form-item label="电话" prop="phone">
          <el-input placeholder="起输入电话号码" v-model="personalForm.phone"></el-input>
        </el-form-item>
    
        <el-form-item label="所属部门" prop="department">
          <el-input placeholder="起输入所属部门" v-model="personalForm.department"></el-input>
        </el-form-item>
    
        <el-form-item label="角色" prop="role">
          <el-input v-model="personalForm.role" :disabled="true"></el-input>
        </el-form-item>
        <el-button type="primary" @click="savePerDetail('ruleForm2')">更新</el-button>
        <el-button type="primary" @click="changePerDetGoBack">返回</el-button>
      </el-form>
    </el-dialog>
    

    这是获取数据的JS:

      getuserdata() {
        let _this = this;
        this.$axios({
          method: "post",
          url: "/api/authController/getMenus",
          data: qs.stringify({
            token: this.token
          })
        }).then((response) => {
          console.log(response)
          let res = response.data.message.user;
          _this.username = res.username;
          _this.gender = res.gender;
          _this.qq = res.qq;
          _this.dianhua = res.phone;
          _this.wechat = res.wechat;
          _this.phone = res.mobile;
          _this.email = res.email;
          _this.realname = res.realname;
          _this.position = res.position;
          _this.department = res.department;
          if (res.roleCode === "user") {
            _this.roleCode = "用户"
          }
          if (res.roleCode === "administartor") {
            _this.roleCode = "管理员"
          }
        })
      },
      
      这是提交数据的JS:
            // 更新个人资料按钮
      savePerDetail(formName) {
          let _this = this;
          this.$refs[formName].validate((valid)=>{
            if (valid) {
              this.$axios({
                method: 'post',
                url:'/api/userController/update',
                data: qs.stringify({
                  token: this.token,
                  id: this.userId,
                  username: this.username,
                  qq: this.personalForm.qq,
                  wechat: this.personalForm.wexin,
                  mobile: this.personalForm.cellphone,
                  email: this.personalForm.email,
                  phone: this.personalForm.phone,
                  department: this.personalForm.department,
                })
              }).then((res)=>{
                console.log(res)
                if (res.data.code === 200) {
                  // this.getuserdata();
                }
              })
            }
          })
      },
      
      然后就是获取不到新的提交上去的数据 这是为啥啊? 求大佬解答
    
    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 喜还∫生怯. 普通会员 1楼

      在Vue中,如果你在获取数据时使用了watchupdateModel等方法,那么你的数据是实时更新的。但是,如果你在获取数据时没有使用这些方法,或者你的数据是从其他地方获取的,那么你的数据可能还没有更新。

      这是因为Vue会在组件加载时运行watch方法来监听数据的变化,然后在数据发生变化时更新组件。如果你的数据是从其他地方获取的,那么这个过程可能需要一些时间才能完成,因此你可能在获取数据之前就已经有了新的数据。

      另外,如果你的watch方法没有监听到数据的变化,那么Vue将不会在数据发生变化时更新组件。在这种情况下,你可能需要检查你的数据源,确保它在更新时能够更新你的组件。

      如果你想要获取数据时更新组件,你可以在watch方法中添加一个deep: true的属性来触发组件的更新。例如:

      javascript watch: { data() { // 获取数据 // ... this.$emit('updateModel', data); }, deep: true }

      在这个例子中,当data属性发生变化时,updateModel事件将被触发,然后组件将更新。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部