原创 Vue中,iframe中的子網頁,調用父網頁的方法2

  這裏有我原來寫的文章:Vue中,iframe中的子網頁,調用父網頁的方法,這裏面寫了, 父子頁面的調用。但是今天寫的時候,遇到了下面的報錯; Uncaught DOMException: Blocked a frame with

原创 ZRender文檔研讀

ZRender文檔研讀 (基於4.3.2版本) 不使用最新的5.x.x的版本是因爲線上文檔和最新版本JS文件不匹配-2022年6月13日 1、文檔地址 1、官方文檔的地址:https://ecomfe.github.io/zrender

原创 Element中Tree樹結構組件中實現Ctrl和Shift多選

  在Element中的樹結構中, 實現多選功能,首先的是判斷有沒有按下鍵盤ctrl和shift按鍵。但是在Element中的tree組件的左鍵點擊事件是沒有提供$event鼠標屬性判斷的。所以就需要在函數中使用自身的$event來判斷。請

原创 基於Element中的el-tree組件的懶加載和更新節點數據

  以前的樹結構都是通過接口調用,獲取所有樹結構的數據,直接給el-tree組件賦值,然後進行一系列的操作。這次遇到了一個新的需求就是,因爲樹結構的數據量會很大,導致不能一次性給到全部的數據,只能按照展開的層級,一級一級的展開並且加載數據;

原创 Vue中組件的遞歸

  先來說下需求,就是一個表單,會有樹形結構一樣,會有子表單,表單顯示什麼內容是後臺通過接口數據來確定的;這個時候就和樹形結構一樣,肯定會有子組件的遞歸;這次是自己第一次寫遞歸,遇到了三個問題記錄下; 1、第一個問題就是,循環表單;看下圖

原创 Vue RSA加密和解密

  接到一個需求,需要對我們的密碼進行加密,然後再傳輸。以前搞過,但是不是Vue中的。現在用Vue弄一遍,大致的思路是一樣的。如果你還不瞭解什麼是RSA的話,可以看看這個和這個。話不多說,首先是安裝 1 npm i jsencrypt -

原创 基於element的Cascader的省市縣聯動

  接到了一個簡單的需求,就是要做一個簡單的省市縣三聯動。這種網上肯定會有相對應的代碼。所以就不自己寫了。找到了,首先是安裝 1 cnpm install element-china-area-data -S 然後就是應用了。然後在過程

原创 table中的tbody高度超出部分,顯示滾動條並固定表頭

  最近寫一個表格,用的是原生table組件,然後發現一個問題,就是沒法設置tbody的高度,請看下面的截圖 然後搜索之後發現,是需要設置外面的table的display屬性爲block。但是發現設置完成之後出現了這樣的現象。就是所有的數

原创 js 獲取正整數各個位上的數字

1 function getDigitNumber(startNumber, endNumber) { 2 var reg = /^[1-9]\d*$/; 3 if (startNumber

原创 解決Input輸入中文重複出現拼音

  下面的代碼,是我們再做一個正則的判斷,不讓輸入我們列舉的特殊符號。大部分情況下是沒有問題的,可是在少數人的電腦上,發現,在輸入中文的時候,會有重複的情況。請看下面的動圖 1 <p>輸入中文,只使用oninput和onkeyup的方式

原创 Vue中,iframe中的子網頁,調用父網頁的方法

  首先需要明確的一點,標題所說的子頁面調用父頁面的方法或者函數,是需要父子頁面配合的。如果子頁面不是你自己開發的, 或者父頁面不是自己開發的,那就沒辦法調用了。而且, 因爲業務的特殊需要,我們用到了iframe,如果只是Vue兩個父子組件

原创 關於時間常用的一些函數的封裝

保存一些常用的時間函數的封裝 1、首先是時間格式化函數 // 時間格式化函數 formatDate(new Date(),"yyyy-MM-dd hh:mm:ss"); export function formatDate(date, f

原创 前端PC人臉識別登錄

  最近在做一個項目,涉及到了人臉識別登錄,我們的人臉識別都是跑在PC端上的。一共發現了三個問題。並且解決了。   第一個問題是,前端掉起攝像頭的時候,報錯“TypeError: Cannot read property 'getUserM

原创 html2canvas 輪播保存每個圖片內容

  接到了一個任務,就是,我們的整個頁面,是一個大的輪播,然後到了固定的時間,比方說晚上12點的時候,截取每個屏幕,然後發送郵件給指定的郵箱。當然了,發送郵件的這些操作,不用前端來關心,前端只需要把屏幕的當前頁截圖保存下來,然後發送給後臺就

原创 基於Element的下拉框,多選框的封裝

  Element是有自己的多選框的,但是,他的兩種表現形式不是我們所想要的。所以,就以Element的下拉多選框爲基礎,封裝了一個自己的多選框。廢話不多說,直接上圖    1、增加一個全部的功能,然後讓選擇全部之後,上面的顯示框中只顯示