javascript基础知识

遍历一个类似这样的元素 form_ :{"a":"1","b":"2","c":"4"}的属性
用 for遍历

   for (const paramName in form_) {
        const paramValue = form_[paramName];
        if (paramValue === null || paramValue === undefined || paramValue === '') {
          this.$message.info("您还有某些参数值未输入")
          
        }else{
           this.$message.info("进行其他逻辑操作")
         }
      }

遍历一个集合 用foreach 比如像

modelListData:

[

        {

            "_id": "64e610edd9495d70119d1047",

            "model_ParaIntro": [

                {

                    "param_defaultValue": "1",

                    "param_name": "a",

                },

                {

                    "param_defaultValue": "2",

                    "param_name": "b",

                },

                {

                    "param_defaultValue": "4",

                    "param_name": "c",

                }

            ],

        },

        {

           ...........省略
        }

    ],

这样的集合

  this.modelListData.forEach(model => {
               let temp = {};
               model.model_ParaIntro.forEach(param => {
                 temp[param.param_name] = param.param_defaultValue;
               });
               this.paramValues.push(temp);
             });

用封装的request请求

     this.request.post("/model/getModelList",{
        params:{
          pageNum:this.pageNum,
          pageSize:this.pageSize,

        }

      }).then(res=>{
        if(res.code===200){
          console.log("成功进行的操作");
        }else{
          console.log(res.msg);
        }
      })

在排序的时候

需要用这种形式进行浅复制 比如const dataCopy = [...this.modelData]; 的作用是创建一个 dataCopy 数组,这个数组包含了与 this.modelData 相同的元素,但是它是一个独立的、不影响原始数组的新数组。其中的三个点 ... 是 JavaScript 中的展开语法(Spread Syntax)。其中的三个点 ... 是 JavaScript 中的展开语法(Spread Syntax)。

如果直接赋值const dataCopy = this.modelData;再对dataCopy进行排序  即使换了变量名 还是会影响原来的modelData数组 因为赋值是深复制

使用了 Axios 来发送 POST 请求,而 Axios 默认会将请求的数据格式设置为 JSON,因此在发送文件上传请求时可能会出现问题。

这个时候就可以换成fectch

  const formData = new FormData();
      formData.append('model_type', this.form.model_type);
      formData.append('model_name', this.form.model_name);
      formData.append('model_intro', this.form.model_intro);
      formData.append('save_time', this.form.save_time);
      formData.append('model_ParaIntro', this.form.model_ParaIntro);
      formData.append('model_file', this.selectedFilescode[0].raw);

      try {
        const response = await fetch('http://127.0.0.1:5000/model/addModel', {
          method: 'POST',
          body: formData,
        });

        if (response.ok) {
          const result = await response.json();
          if (result.code === 200) {
            this.$message.success(result.msg);
          } else {
            this.$message.error(result.msg);
          }
        } else {
          this.$message.error('上传失败');
        }
      } catch (error) {
        console.error('上传失败', error);
        this.$message.error('上传失败');
      }

用axios上传文件要加请求头 'multipart/form-data'

// 导入 axios 库
import axios from 'axios';

// 创建一个 FormData 对象
const formData = new FormData();
formData.append('model_type', '回转分区');
formData.append('model_name', 'hhh11');
formData.append('model_intro', 'hahhaha');
formData.append('save_time', 'hwudhuwhd');
formData.append('model_ParaIntro', '[]');
formData.append('model_file', params.file);

// 发送 POST 请求
axios.post('/model/addModel', formData, {
  headers: {
    'Content-Type': 'multipart/form-data', // 设置请求头为文件上传类型
  },
})
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

正常的传参产生数据的页面刷新一般是怎么样的 因为传的参 一般刷新后就没了 比如我做一个模糊搜索 那么搜索的关键字传到组件里 在刷新后会没 那么就无法将原来的搜索得到的页面刷新出来 我之前都是存到浏览器缓存里 但是我觉得这样不正规 

在 Web 开发中,确实存在这样的情况:当你传递参数用于生成页面内容(比如模糊搜索关键字),在刷新后这些参数会丢失,导致无法还原之前的页面状态。你提到的浏览器缓存是一种解决方法,但你认为这可能不够正规。

以下是一些处理这种情况的方法:

  1. URL 参数:将参数添加到 URL 中,这样在刷新页面时参数仍然会保留在 URL 中,从而可以还原页面状态。这也允许用户通过收藏链接或复制 URL 来分享特定状态的页面。你可以使用 JavaScript 操作浏览器的地址栏来实现这一点。

  2. 会话存储(Session Storage):使用 Web Storage API 中的会话存储功能,将关键信息存储在会话存储中。这样在同一个浏览器标签或窗口中,刷新页面时数据仍然会被保留。然而,关闭浏览器标签或窗口会导致数据丢失。

  3. 本地存储(Local Storage):类似于会话存储,但数据会持久保存,即使关闭浏览器标签或窗口,数据也不会丢失。但是,过度使用本地存储可能会导致存储空间问题,而且不太适合存储敏感信息。

  4. Cookies:通过设置 Cookie 将数据存储在用户浏览器中。这是一种传统的方法,但由于存储容量有限,可能不适合大量数据。

  5. 状态管理工具:在前端框架(如React、Vue等)中,你可以使用状态管理工具(如Redux、Vuex)来管理应用的状态。这可以帮助你在页面刷新时保留状态。

  6. 服务器端保存状态:如果你的应用程序有后端,你可以将搜索关键字等状态保存在服务器上,然后通过用户身份验证来还原页面状态。这样即使用户刷新页面,数据也可以从服务器获取。

你可能感兴趣的:(javascript,前端,java)