Typescript騷操做,在TS裏面直接插入HTML

Typescript騷操做，在TS裏面直接插入HTML，還有語法提示

先給你們看一個圖

由於我不喜歡用很重的框架，主要是並不是專業UI，可是偶爾會用到，仍是以爲直接element組裝受不了，想一想能在ts文件裏面能直接插入html就行了。

插進去不難，但是苦於沒有語法提示，你們看上面這個圖，語法提示的問題已經解決了。

下面我來詳細講解一下這個騷操做

1、安裝vscode，別的工具我沒研究，大差不差

2、安裝插件

是由這個插件提供的語法高亮

3、添加兩個函數

export function raw(a:TemplateStringsArray,...values:any[]):string

{

var len = a.length-1;

var outstr = a[0];

for(var i=0;i<len;i++)

{

outstr+=values[i]+a[i+1];

}

return outstr;

}

export function html(a:TemplateStringsArray,...values:any[]):HTMLDivElement

{

var div =document.createElement("div");

div.innerHTML =raw(a,values);

return div;

}

這兩個函數是自定義兩個拼裝字符串的方法 針對於ts中的特殊字符串

若是遇到問題，最多見的就是 export的，刪掉export

用這個特殊的引號引發來的字符串,注意鍵位，不是普通的單引號

4、浪起來

而後就能夠帶着語法提示寫字符串了

這兩個標籤我定義爲 raw ‘’ 返回一個字符串

Html 返回一個div對象