{{ 10 | fn1 | fn2 }} for example, you can use filter in the template of vue.
I wonder, how exactly does Vue implement it? Do you have a simple explanation?
{{ 10 | fn1 | fn2 }} for example, you can use filter in the template of vue.
I wonder, how exactly does Vue implement it? Do you have a simple explanation?
put aside the mechanism of Vue, something like this.
//
let str = '10 | fn1 | fn2';
//
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]);
} is an ordinary function call. It is written in the form of a pipeline, which takes the value or result of the face as the following input parameter, such as 10 | fn1 | fn2 | fn3 . By parsing the string and dividing it according to | , you can get ['104th,' fn1', 'fn2',' fn3'] . Then the process of calling is:
fn3(fn2(fn1(10)))? You can use no code.