在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/網(wǎng)絡(luò)安全  HTML/ Vue中的filter是怎么實(shí)現(xiàn)的?

Vue中的filter是怎么實(shí)現(xiàn)的?

{{ 10 | fn1 | fn2 }}

比如在vue的模板中可以這樣使用filter。
我很好奇,Vue具體是怎么去實(shí)現(xiàn)它的?有沒有簡(jiǎn)單的解釋下?

回答
編輯回答
真難過

就是普通的函數(shù)調(diào)用啊,書寫的形式有點(diǎn)像管道,將面的值或結(jié)果為后邊的入?yún)?,比?10 | fn1 | fn2 | fn3,通過解析字符串,按照|分割,得到['10', 'fn1', 'fn2', 'fn3'], 那么調(diào)用的過程就是:

fn3(fn2(fn1(10)))
2018年6月22日 17:54
編輯回答
冷眸

拋開Vue的機(jī)制,大概類似這樣吧。

// 視圖中的字符串
let str = '10 | fn1 | fn2';
// 模型中的宿主對(duì)象
let host = {
  fn1: a => 2 * a,
  fn2: a => 3 + a
};

filter(str, host); // 3 + (2 * 10) = 23

function filter(str, host) {
  let arr = str.split(/\s*\|\s*/g);
  return arr.slice(1).reduce((a, b) => host[b](a), arr[0]);
}
2018年4月8日 16:11
編輯回答
雅痞

有沒有更為通俗點(diǎn)的解釋?可以不用代碼。

2017年4月25日 00:41