常用代码

 

强制刷新组件

this.forceUpdate();  //强制刷新组件

 

//react 转html

function createMarkup(str) {
    return { __html: str };
}

 <div dangerouslySetInnerHTML={createMarkup(tips)}></div>

 

 获取滚动条高度及元素距离顶部的距离

获取滚动条高度
const scrollHeight=$(document).scrollTop(); //滚动条高度
 
获取元素距离顶部的距离
 
const offsetTop=$this.closest('table').offset().top-scrollHeight; //元素距离顶部距离减去滚动条的高度

 

亲身体验，用npm i安装的模块无法用npm uninstall删除，用npm uninstall i才卸载掉

 

路劲问题

直接在package.json里加 "homepage":"." 就OK了，会在路径前加homepage的值

 

获取图片类型

menuFile.fileName.split('.')[menuFile.fileName.split('.').length - 1]

 

原生JS获取和设置指定属性

获取和设置属性
getAttribute
object.getAttribute(attribute)
注：getAttribute方法不属于document对象，它只能通过元素节点对象调用。


setAttribute
object.setAttribute(attribute,value)


removeAttribute

object.removeAttribute(attribute)



例子：
var shopping = document.getElementById("purchases");
shopping.setAttribute("title","a list of goods");
shopping.removeAttribute("title");
document.getElementById("purchases");

 

数组添加方法

Array.prototype.removeByValue = function(val) {
  for(var i=0; i<this.length; i++) {
    if(this[i] == val) {
      this.splice(i, 1);
      break;
    }
  }
}
var somearray = ["mon", "tue", "wed", "thur"]
somearray.removeByValue("tue");
//somearray will now have "mon", "wed", "thur"

 

tsx 指定数组添加方法的类型

export {}

declare global   {
  interface Array <T>{
    move(): string
  }
  
}

 

es6模板 事件加参数

let vals="人生就像一杯水，孤独，孤独，孤独，一辈子就完了"
        let valus1=`<button onclick="clk('${vals}')">确定</button>`
        $(".t1").html(valus1);
        function  clk(val){
            console.log('click',val);
            
        }

 

 

// 是否有空值

// 是否有空值
                        const allOptionhasValue = value.every(
                          (item: any) => !!item?.optionName && (!!item?.score || item?.score == 0),
                        );

 

获取设置元素

var event=arguments.callee.caller.arguments[0]||window.event;//消除浏览器差异

var e=window.event||event; //消除浏览器差异 

 event.currentTarget  //获取设置元素

event.currentTarget  //点击获取当前

 event.preventDefault(); // 阻止默认点击

event.target.parentNode.innerText
event.target.parentNode.innerHTML
获取id
var id = e.target.getAttribute("id");  //获取调用setEffect函数元素的id

通过 id 获取DOM元素的方法 :   document.getElementById( "idname ")   
通过 name 获取DOM元素的方法：   document.getElementsByName( "name ")[0?1?2?3?....]  
通过class获取DOM元素的方法：document.getElementsByClassName("class名") 

从函数的名字可以知道，通过getElementsByClassName获取到的是一个数组，包括多个DOM元素，所以要执行DOM元素的方法，必须加一个索引，比如document.getElementsByClassName("class名")[0]。
而由于id是唯一的，所以通过getElementById只有一个DOM元素，可以直接调用DOM方法。
即：  document.getElementsByClassName("class名")[0] 

document.getElementById("a1").getAttribute("class");   获取class属性

document.getElementById( "id_Number ")   得到的是单个元素   

document.getElementsByName( "name ")   得到的是数组  
document.getElementsByName( "name ").innerHTML

  比如隐然DOM元素

  1、document.getElementById("id名").style.display="none"

  2、document.getElementsByClassName("class名")[0].style.display="none"

//data-前缀属性可以在JS中通过dataset取值，更加方便

tree=document.getElementById("id名")
console.log(tree.dataset.leaves);
console.log(tree.dataset.plantHeight);
//赋值
tree.dataset.plantHeight = "3m";
tree.dataset.leaves--;
//新增data属性
tree.dataset.age = "100";
//删除，设置成null，或者delete
tree.dataset.leaves = null;
delete tree.dataset.age;

ref
比如设置一个
<li ref="myLi">test</li>

this.refs.myLi.value，this.refs.myLi.text, this.refs.myLi.innerHTML

appendChild(clientlist);

//选择第几个
const admin_name = nodes
      .querySelectorAll("#profile_block a")[0]
      ?.innerHTML?.replace(/(^\s*)|(\s*$)/g, "");

 http://blog.csdn.net/kongjunchao159/article/details/47317763

 

Umi 4 提供了自定义加载组件的机制来解决这个问题。开发者可以通过创建 src/loading.tsx 文件来自定义加载时的显示内容，替代默认的白屏状态