vue中replace有什么含義

這篇文章給大家分享的是有關(guān)vue中replace有什么含義的內(nèi)容。小編覺得挺實(shí)用的，因此分享給大家做個(gè)參考，一起跟隨小編過來看看吧。

vue中replace的含義是“替換”，可以用于匹配指定的字符串并替換，或者替換跳轉(zhuǎn)時(shí)的記錄，語法為“str.replace(regexp/substr,replacement)”或者“router.replace(location)”。

本文操作環(huán)境：windows10系統(tǒng)、Vue2.9.6版，DELL G3電腦。

vue.js源碼replace方法

/**
   * Camelize a hyphen-delimited string.
   */
  var camelizeRE = /-(\w)/g;
  var camelize = cached(function (str) {
    return str.replace(camelizeRE, function (_, c) { return c ? c.toUpperCase() : ''; })
  });
  /**
   * Hyphenate a camelCase string.
   */
  var hyphenateRE = /\B([A-Z])/g;
  var hyphenate = cached(function (str) {
    return str.replace(hyphenateRE, '-$1').toLowerCase()
  });

語法

str.replace(regexp|substr, newSubStr|function)

參數(shù)

• regexp (pattern)

一個(gè)RegExp 對象或者其字面量。該正則所匹配的內(nèi)容會(huì)被第二個(gè)參數(shù)的返回值替換掉。

• substr (pattern)

一個(gè)將被 newSubStr 替換的 字符串。其被視為一整個(gè)字符串，而不是一個(gè)正則表達(dá)式。僅第一個(gè)匹配項(xiàng)會(huì)被替換。

• newSubStr (replacement)

用于替換掉第一個(gè)參數(shù)在原字符串中的匹配部分的字符串。該字符串中可以內(nèi)插一些特殊的變量名。參考下面的使用字符串作為參數(shù)。

• function (replacement)

一個(gè)用來創(chuàng)建新子字符串的函數(shù)，該函數(shù)的返回值將替換掉第一個(gè)參數(shù)匹配到的結(jié)果。參考下面的指定一個(gè)函數(shù)作為參數(shù)。

replace文檔查看

第一種camelize轉(zhuǎn)換方法：

replace指定一個(gè)函數(shù)作為參數(shù)，通過控制臺看他輸出的內(nèi)容

上述可以看出replace通過全局正則匹配，類似于exex和test的lastIndex實(shí)現(xiàn)

vue源碼中的replace會(huì)全局匹配，運(yùn)行函數(shù)體進(jìn)行newStr的替換

第二種hyphenateRE轉(zhuǎn)換使用特殊變量名$參數(shù)

描述

該方法并不改變調(diào)用它的字符串本身，而只是返回一個(gè)新的替換后的字符串。

在進(jìn)行全局的搜索替換時(shí)，正則表達(dá)式需包含 g 標(biāo)志。

使用字符串作為參數(shù)

替換字符串可以插入下面的特殊變量名：

變量名 代表的值

$$ 插入一個(gè) “$”。

$& 插入匹配的子串。

$` 插入當(dāng)前匹配的子串左邊的內(nèi)容。

$’ 插入當(dāng)前匹配的子串右邊的內(nèi)容。

$n 假如第一個(gè)參數(shù)是 RegExp對象，并且 n 是個(gè)小于100的非負(fù)整數(shù)，那么插入第 n 個(gè)括號匹配的字符串。提示：索引是從1開始

eg:正則全局匹配非單詞邊界，在這里匹配連字符+大寫字母，然后-$1全局替換

router.replace(location)

設(shè)置 replace 屬性（默認(rèn)值: false）的話，當(dāng)點(diǎn)擊時(shí)，會(huì)調(diào)用 router.replace() 而不是 router.push()，于是導(dǎo)航后不會(huì)留下 history 記錄。即使點(diǎn)擊返回按鈕也不會(huì)回到這個(gè)頁面。

加上replace: true后，它不會(huì)向 history 添加新記錄，而是跟它的方法名一樣 —— 替換掉當(dāng)前的 history 記錄。

//聲明式：
<router-link :to="..." replace></router-link>
// 編程式:
router.replace(...)
//push方法也可以傳replace
this.$router.push({path: '/home', replace: true})

感謝各位的閱讀！關(guān)于“vue中replace有什么含義”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，讓大家可以學(xué)到更多知識，如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！