文件管理系统debug记录_unexpcted character in numeric value expected digi-优快云博客

这篇博客记录了在Vue项目开发中遇到的一些问题及解决方案，包括关闭eslint严格模式、less-loader版本问题、vue组件局部刷新、作用域插槽理解、el-radio的使用、长整型变量精度丢失、vue-router报错、文件上传问题等。通过这些调试经验，有助于开发者在遇到类似问题时快速找到解决办法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

vue学习

1 关闭eslint严格模式：

module.exports = {
  root: true,
  parserOptions: {
    parser: 'babel-eslint'
  },
  env: {
    browser: true,
  },
  extends: [
    // https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
    // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
    'plugin:vue/essential',
    // https://github.com/standard/standard/blob/master/docs/RULES-en.md
   // 'standard'         //此处注释掉
  ],
  // required to lint *.vue files
  plugins: [
    'vue'
  ],
  // add your custom rules here
  rules: {
    // allow async-await
    'generator-star-spacing': 'off',
    // allow debugger during development
    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
  }
}

2、

Module build failed: TypeError: this.getOptions is not a function

原因： less-loader安装的版本过高
解决方案： 1.npm uninstall less-loader
2.npm install less-loader@6.0.0

3、vue组件局部刷新。

4、Vue slot-scope=‘scope’的理解

首先要理解2个知识点：
1.插槽
2.作用于插槽

插槽，也就是slot，是组件的一块HTML模板，这块模板显示不显示、以及怎样显示由父组件来决定。实际上，一个slot最核心的两个概念这里就点出来了，是显示不显示和怎样显示

作用域插槽实际上是带有数据的插槽，可以获取到父组件传递的参数，将这些参数使用到子组件插槽里

<w-table-column prop="je" label="总价" width="100">
	 <template slot-scope="scope">
	   	<span>{{Number(scope.row.je).toFixed('2')}}</span>
	 </template>
</w-table-column>

<el-table>
  <el-table-column width="150" align="center" label="Status">
    <template slot-scope="scope">
      <el-tag :type="scope.row.status | statusFilter">
      	{{scope.row.status}}
      </el-tag>
    </template>
  </el-table-column>
</el-table>

现在统一成了slot-scope，其语义更加的明确。scope相当于一行的数据， scope.row相当于当前行的数据对象。这里就是用插槽拿到当前行 row是个内置的属性，vue slot的scope传递值是父作用域中的源数据改变，值会同步改变。且{{scope.$index}}可以获取当前行的index。

5、el-radio

当值为数字时：

el-radio设置默认值，单选框设置默认值

<el-form-item label="性别" prop="gender">
  <el-radio v-model="editForm.gender" label="0" :value="1">男</el-radio>
  <el-radio v-model="editForm.gender" label="1" :value="2">女</el-radio>
</el-form-item>

当值为字符串时：使用

<el-form-item label="仿牌选项：" prop="ifCod" size="mini" class='form-label'>
 <div id='radio' >
    <el-radio class='m0' :disabled="disable" v-model="form.ifCod" label="0" >普货</el-radio>
    <el-radio class='m0' :disabled="disable" v-model="form.ifCod" label="1" >仿牌</el-radio>                                 
  </div>
</el-form-item> 

data(){
	return {
		form:{
			ifCode:'0'
		}
	}
}

好像就是加不加’:'的问题。

6、long型变量传递到前端，精度丢失

@JsonSerialize(using = ToStringSerializer.class)
@ApiModelProperty(value = "用户ID")
@TableId(value = "user_id", type = IdType.ASSIGN_ID)
private Long userId;

问题原因，js long型变量16位，java long型变量，18位。

在字段上添加注解：

@JsonSerialize(using = ToStringSerializer.class)

7、

赋值，直接使用v-model绑定值

8、vue router报错

RangeError: Maximum call stack size exceeded
at String.replace ()

报这个错意思是程序死循环

怎么解决的呢，忘记了，换了个浏览器，就好了。

9、

Resolved [org.springframework.web.multipart.support.MissingServletRequestPartException: Required request part ‘files’ is not present]

上传文件遇到的问题，传递的参数不对

10、

the request was rejected because no multipart boundary was found

文件上传时的问题。

改变，创建一个表单，放入数据，然后异步上传。

let formData= new FormData();
for(var i=0;i<this.upfileList.length;i++){
  formData.append('file', this.upfileList[i]);
}
axios({
  method: "post",
  url: "/api/file/upload",
  headers: {

    token: localStorage.getItem('logintoken')
  },
  data: formData,

}).then((response)=>{
  this.$message({
    message: response.msg,
    type: 'success'
  });
  console.log(response);
}).catch((error)=>{
  this.$message.error(error.msg);
  }
);

11、

Unexpected character (’-’ (code 45)) in numeric value: expected digit (0-9) to follow minus sign, for valid numeric value

因为传递的数据不正确

错误的代码：

  let loginForm=new FormData();
          loginForm.append("username",this.ruleForm.username);
          loginForm.append("password",this.ruleForm.password); 
axios({
            method: "post",
            url: "/api/login",

            data: loginForm
          }).

改为：

 ruleForm: {
        //username和password默认为空
        username: '',
        password: '',
        code: '',
        randomStr: '',
        codeimg: ''
      },
axios({
  method: "post",
  url: "/api/login",

  data: this.ruleForm,
})

12再次报错：

Unrecognized field “code” (class com.grand.security.security.entity.User), not marked as ignorable (5 known properties: “token”, “password”, “username”, “nickName”, “salt”])

修改为：

let updata;
updata={"password":this.ruleForm.password,"username":this.ruleForm.username}
console.log(this.ruleForm)
axios({
  method: "post",
  url: "/api/login",

  data: updata,
})

不报错

13、返回成功的数据不进行跳转，前端判定失败

返回的数据格式为

{“success”:true,“code”:20000,“msg”:“成功”,“data”:{“token”:“eyJhbGciOiJIUzUxMiIsInppcCI6IkdaSVAifQ.H4sIAAAAAAAAAKtWKi5NUrJSKqpU0lFKrShQsjI0M7I0tDQ1MTCuBQCFOqS0HQAAAA.yskCe-YTMaLXjxr4NjcTh7N0mYIba4IS_ZicIg-h3mUsi_-7GsjzWJPiUuarOpThsV9pkDwyt4o81nzhvKi5lQ”}}

res相当于{data:返回的json数据}

所以需要再加一层寻址

错误的为：

axios({
  method: "post",
  url: "/api/login",

  data: updata
}).then(res => {
  if (res.success) {     //这里   
    if (this.rememberpwd) {
      //保存帐号到cookie，有效期7天
      setCookie('user', this.ruleForm.username, 7)
      //保存密码到cookie，有效期7天
      setCookie('pwd', this.ruleForm.password, 7)
    } else {
      delCookie('user')
      delCookie('pwd')
    }              //如果请求成功就让他2秒跳转路由
              setTimeout(() => {
                this.logining = false
                // 缓存token
                localStorage.setItem('logintoken', res.data.data.token)
                // 缓存用户个人信息
                localStorage.setItem('userdata', JSON.stringify(res.data.data))
                this.$store.commit('login', 'true')
                this.$router.push({ path: '/system/SystemInfo' })
              }, 1000)
            } else {
              this.$message.error(res.msg)
              console.log(res)
              this.logining = false
              return false
            }
          })
        } else {
          // 获取图形验证码
          this.getcode()
          this.$message.error('请输入用户名密码！')
          this.logining = false
          return false
        }
      })

更改后：

axios({
      method: "post",
      url: "/api/login",

      data: updata
    }).then(res => {
      if (res.data.success) {
        if (this.rememberpwd) {
          //保存帐号到cookie，有效期7天
          setCookie('user', this.ruleForm.username, 7)
          //保存密码到cookie，有效期7天
          setCookie('pwd', this.ruleForm.password, 7)
        } else {
          delCookie('user')
          delCookie('pwd')
        }
        //如果请求成功就让他2秒跳转路由
        setTimeout(() => {
          this.logining = false
          // 缓存token
          localStorage.setItem('logintoken', res.data.data.token)
          // 缓存用户个人信息
          localStorage.setItem('userdata', JSON.stringify(res.data.data))
          this.$store.commit('login', 'true')
          this.$router.push({ path: '/system/SystemInfo' })
        }, 1000)
      } else {
        this.$message.error(res.msg)
        console.log(res)
        this.logining = false
        return false
      }
    })
  } else {
    // 获取图形验证码
    this.getcode()
    this.$message.error('请输入用户名密码！')
    this.logining = false
    return false
  }
})