2021SC@SDUSC amis代码分析(11)

最新推荐文章于 2022-11-22 17:25:17 发布

ZCY2576

最新推荐文章于 2022-11-22 17:25:17 发布

阅读量218

点赞数 1

分类专栏： amis 文章标签： reactjs

本文链接：https://blog.csdn.net/ZCY2576/article/details/121867114

版权

本文主要分析了amis中的resolveVariable函数，探讨了如何根据路径获取数据，同时介绍了prettyBytes、escapeHtml、formatDuration和makeSorter等实用函数，展现了在ReactJS中处理数据和操作的技巧。

摘要由CSDN通过智能技术生成

2021SC@SDUSC

文章目录

概述

本周学习amis中怎么泛化地书写将数据从各个对象中取出来的代码以及几个其他值得学习的功能函数。

resolveVariable(path,data)

对于给定的一个路径path，可以分成两类：

// 1
a.b.c | a.b[1].c
// 2
ns: varname

当为第一种的时候，给的是一个属性路径，这需要我们从data中获取各个级别对应的属性值，层层查找，直到最后一级即为目标值。
当为第二种的时候，是一个键值对的形式，ns 是数据存储的对象，varname 是同第一种的属性路径。包括window、localStorage、sessionStorage、Cookit以及以下自定义的位置。其实，第一种方式相当于省略了ns = data的条件。

代码分析：

// 获取 data 对象在 Path 路径的变量值
function objectGet(data: any, path: string) {
   
  if (typeof data[path] !== 'undefined') {
   
    return data[path]; // 只有一级路径时
  }
  // 将 path 切分成各级路径
  let parts = keyToPath(path.replace(/^{|}$/g, ''));
  return parts.reduce((data, path) => {
   
    // 迭代的取每一级的路径中的属性值
    if ((isObject(data) || Array.isArray(data)) && path in data) {
   
      return (data as {
   [propName: string]: any})[path];
    }
    // 只要有一级没有，总为 undefined
    return undefined;
  }, data);
}

function parseJson(str: string, defaultValue?: any) {
   
  try {
   
    return JSON.parse(str);
  } catch (e) {
   
    return defaultValue;
  }
}

// 在 Cookie 中获取对应的键值 name
function getCookie(name: string) {
   
  // Cookit 总是以分号分割，结尾不加分号
  const value = `; ${
     document.cookie}`; // 手动补充一个分号。注意空格！
  const parts = value.split(`; ${
     name}=`); // 寻找目标属性
  if (parts.length === 2) {
    // 说明 split 切割成功
    return parts.pop()!.split(';'