00:00
大家好,我是学习园地的特约讲师高若峰,上节课咱们介绍了options里边的基本定义,咱们定义的一个date和声明自定义方法的地方,又介绍了VIVO的一个工作原理,为什么可以数据可以动态绑定,对吧?它是基于MVVM这样的一个工作模式的一个,相当于一个设计模式,那上节课呢,咱们又做了一个简单的一个例子,然后呢,来说明它的参数的基本定义和这个模式的一个呃情况,那这节课呢,我们继续往下学,从这节开始呢,我们来学习will的基础语法。那学习它里边模板里边的基础语法,来我们看一下看这那will中的基础语法都有哪些呢?有这么多,那我就第一个给大家读一遍了,那咱们从第一个开始学差值操作,差值操作。那什么是差值,什么是指令?先看它的差值和指令是模板中的一个语法啊,咱们讲的基础语法都是在模板中使用的,那我们就先得把这个模板做好,把上节课的例子呢给大家保存一份。要到六一。
01:00
呃,V1就是咱们第一节课写的一个例子,给保存一下,当然我们复制一下是在这里边,我别在这里边改,就看到效果给它关掉,还是在VIVO这里边改,那我们把这个嗯,再恢复到原状,当然了,我们也可以把浏览器打开,在这块它会自动刷新的,对不对,这个我们也去掉,然后呢,我们把date这块还原为我们一个阶层的一个格式,然后我们再把只留我们方法的结构这里边去掉。只留我们最基础的一个方法的一个结构就可以了。那我们说这个再给大家保存一份。这位叫做嗯,DEMO基础的一个格式。或者你叫都可以啊,那我下次每次讲课的时候,我想要这样的一个模板结构,我就可以直接用这个了,只么每次都新建一,因为名称得对应上,这样的话我在慢点里边带点,而T里边定义这些东西不用动了,我们直接写这个页面就可以了,就可以讲解我们这些基础的语法部分了。啊,这就是我们定义的这个基础结构,那现在咱们看一下。什么是差值,什么是指令,这是一个基本语法模板,基本语法是最常用的,什么差值呢?就是我们这里边声明的值,不管你是一个也好,还是多个也好,这是一个测试,假如说就是一个字块,对吧,那我这个直行呢,在模板里边使用,你看这是模板,也就是在我们T里边使用,怎么把这里边的数据在我模板里显示的几种方式,要么你用差值的方式,要么你用指定的方式,这两种去选,那我们前面学过,差值就是在HTML的内容里边,我们用双大括号,双大括号你可以在这里边,你也可以在,比如说我们说明一个he可以在这里边都可以,对不对?
02:36
只要是我们在这个模板里边,都属于这个模板的内容,那差值在这里边使用MSG来,我们看一下这个浏览器就播了。保存一下我的心。等下这个你看就写错位置了,写到哪去了。你看啊,我们写在了这个里边,他说得把它关掉,得写到这里面对不对,不然的话,它这个是不变化的,对吧,这里边返回一个MSG。
03:03
这个是每次复制咱们去用它的啊,这随便写一个,这是呃,Past随便写一个,你看就行了,这是差值对吧?那前面咱们经常讲这样的一个语法,当然了,这样的语法,它这里边呢,除了你直接把这个里边date的数据放进来,就把值插入到们里边,这是差值嘛,它还支持简单的语法,什么叫简单语法,比如说我还有一个字符串,我有一个str,一个字符串,这里边写上哈。呃,Voe对吧,那我想把这两个字符串都写上这块,如果我们用空格,你看I'msg,对str这样的方式肯定是语法错误,你看这样语法错误,为什么空格不是这样的语法对不对?因为你想我们假如说这里边执行的是我们GS,那GS2个字符串相连,你是不是还得有个加号呢,对吧?你那就可以了,那如果中间想连接空格,你加号这样显示空格就可以了,对吧?所以它这里边直接支持date里边的变量,以及一些基础运算的一个语法,复杂的逻辑不要往这里放,比如说我这里边想放什么三元运算符啊,或者是一语句啊,如果你这边写大量的一副语句,对吧。
04:10
你看这肯定出错的对不对?你那有说要不写一副语句,我写定义个函数对不对,定义一个函数都可以呢,你看也出错,逻辑的东西不要写在这里边,简单的运算写在这里边,什么叫简单运算呢?比如说我这里边定一个um等于100对吧,那这里边我们用上um对吧,加上A,你看。200对不对,那这个乘以二,你看这些简单的运算是可以放进来的。但是有逻辑的东西,稍稍有点逻辑东西,我们都需要写在哪里啊,我们尽量像我们这些方法里边去写交互程序对吧,这里边就是变量自身的一些基本的运算,使用在这个里边就行了。一些基本的运算就就可以了啊。那这就是差值,除了基本的变量,那我们再往这里放一些基础的语法。对吧,MS这放的话,大家做参考去使用的。
05:01
那么下面来看一下指令,指令呢是以V杠开头的,这里边V杠开头的,也就是在这个里边和V杠开头指令进行数据绑定,支持JS单个表达式就很简单的,所以就支持单个表达式,那复杂的不要往里放也没有意义,会把我们整个页面,咱们尽量用微流层和摸读层的什么完全分离开嘛,对吧。你如果混在一起的话,那就密分开了,所以我们还是要求分开的。那我们看一下那V杠指令是干嘛的呢?我们先讲几个简单的指令,比如说。呃,V杠,Pre这个指令是杠,我先把这个复制一下啊,复制一下,对比一下V杠,比如说pre这个呢,类似于我们,你看这个内容没有给我们解析,就不解析里边的内容,用这个是不是有点类似于我们什么pre这个标签啊,对不对,AB窗格CC,但是跟这个不一样,你看如果我们写的标签的话,这是内容里边原封不动的,而我们这块是不解析,就是数据库绑定,就是P,就原生的这个语法,相当于让它不起作用,不解析这个变量。
06:06
你比如这里边我正好随便在a ABB空格对吧,C1C,你看它是没有效果的对吧,还是AB ABB CC,它是可以这么连接的,然后插入变量。差值嘛,对吧,所以呢,要知道它和它还是有区别的,但是同样用这个词是这个意思,那我们还有一个什么呢。我们还有一个叫呃,Ones的,只用一次,或者说只用初值,这里边MSD叫什么?嗯,V开头的,V杠开头的,你看V杠开头有这么多指令,这个工具给我们提示了,你看有这么多对不对,有这么多,那有一个就什么one。不就一次的意思嘛,对不对,那它和我们这个HR显示的有什么区别呢?你看没有什么区别,这会根本就没有区别对吧。那假如说他万是不是这个值有初始值,这个改变这个值就没效果了,放心的改变。是不也跟着变了,最下边这个使用万词,对,它是你这块的初值,只使用这个第一次充值,如果这个初值用程序改变就没用了,比如说我下边,嗯,在这个中间用一个按钮,嗯,用一个按钮吧,Dot to。
07:10
嗯,在这加一个按钮吧,然后这里边是b to一个按钮。你看这是一个按钮就在,然后我们我把这个换一个去改,我这块不叫你看我这块叫嗯nu,这样的话,我可以很容易去改这个值啊,然后在这里边你看啊加上事件click点击的时候要N有是加加。对吧,简单的一个语法,那现在你看。默认的值。这个是100。嗯,ABC写在这里边了。把它写到这个里面。你看这是100对不对,现在我如果像刚才似的,我在这块改成100定义。对吧,两个肯定都是101,这没问题,但是现在我用按钮去操作改变的时候,你看上边只要用到N的,原来绑定值都会跟着变化,对不对,但是这个只用这里边定义的是当时的初值用一次。
08:08
这就这个指令。那我们除了这指还有什么指令呢?我们还有两个。比如说。嗯,当然有,有很多了,咱们在这里边再讲两个,一个呢是比如说我们还是定一个HR吧,定一个HR。第一个叫V2T。文本它类似于什么呢?类似于我们原来用do操作的时候,里边的什么inner test,类似于这个操作等于什么,就像RTM里边插入文本的,对吧,平时这个我们用的很少,为什么用的很少呢?因为我们VR test这个我们平时在这个里边用。那我们在这块V。V2T test,那在这里边写上,这是一个总测试,不好,我就随便一行一吧。你看这行一就会在这显示对不对,那如果这里边我显示一行二,它会将这个test给二这个覆盖看到了吧,当然了,这块呢,就这里边会模板出错,已经是你用微微test写内容了,就不要在这写内容了。
09:14
包送。你看,那我们删掉这个就可以了,因为这里边内容会覆盖到这里的内容,因为你这里边写的内容是无效的,所以呢,我们会给你报错,你看。这地方啊。是不能形的,那这里边可不可以是变量呢?当然也是也是可以的,你看这个,如果使用V-test的,原来我们都是单指令里边不加任何值,不加任何值呢,是修饰监括号中间的元素内容的,你看这个,还有这个都是修饰元素内容的元内容的,那如果你加上双引号,这个指令双引号或者单引号,那这里边就可以写简单的语法,比如说mst。你看这是一个测试,比如说。你看都可以,比如说乘二。对吧,一百一十五十二对不对。
10:00
加你乘除的都可以了,你比如说加上一个呃,MC。你看连接中串对吧,那中间我们再加上一个碰撞。你看都可以了,对吧,所以呢,也和我们差值一样,支持一些基本的语法在这里面。三。单表还是可以的,太复杂的业务逻辑,就算他支持也不要往这里放,就把我们页面弄乱,那这里边支不支持什么呢?如果我们像在内容里边写的时候,你像我们这里边,HR里边,我们在支持一个标签,当然我们这是可以这样去写的,你看。啊,这个不写在里边。嗯,因为写在这个里面,这里面是原不动的那个付出,对不对不。啊,这个解析到这块放在这里没关系,你看这块是I解析了,这是支持填标签的,那如果我在这个文本里边,现在说的是这个,这里边支不支持而标签的,那这里边写一个嗯,I标签写个嗯,Nu。斜盖还标签。
11:02
你看出错这里边不支持,不能在这里边再写,那不能在这里边写,但出错我们得去掉,那我们有没有能在这里支持的呢?有,你看我们把标签换掉,换成什么呢?换成HTML。那换HTML,当然了,我们同样你不用是TML的时候,差值你可以在这写是没问题的。但是有的时候为什么说我们用这个去写。用这个你看啊。为什么不用差值,要用V杠,RTM2它和这里边直接写值有什么区别?那首先我们先看一下这里边之间,如果这么写的话也是报错,如果加上这个里边就不能解值了,那放内容的地方在这写,那放内容的地方都是在这,对吧?都是在这的话,那里边一样可可不可以加减乘除呢?你看可以对不对,一样是可以加减乘除的,然后这个你往下算一下啊,就给大家都复制一下。只要能运行过的都是合法的语法,这里面就不会报错,对吧,大家也看到了。那这里边假如说我放上一个嗯,I标签,应该是倾斜一下斜杠I,然后nu这么放行不行呢?那这么放也出错,那时候不放HTMMR的话,那怎么放呢?我们不是说在这放,在这放的话看着很别扭,对吧,我们怎么办呢?V杠,RTMMR,我们在这个地方,比如说我们声明一个像我们为什么总用它,比如说我们从服务器端给我们输出过来的反回过来的数据,假如说有一个A链接,我们叫做UR吧,那它跟我们服务器端在数据库里面保存的就是带着添标签的,特别我们用副文本加的那些字符串,假如说是带标签的,那我们比如说A标签AF等于,嗯,当然了,最外层储最好用那种什么。
12:35
咱们说模板做串这种方式。这种方式对吧,这里边比如说HT冒号3w.MK。点com,然后斜杠A对吧,那这里边比如说我们是学习圆,那这样的一个模板字符串,那这模板字串呢,我们这里边我们现在放上这个变量UR的ul,它就是可以干嘛呀,可以帮我们把这个解析掉,直接给我们加上链接。
13:04
那就是说我用这个的话,我直接。这样行不行啊,你看用插值的方式,我写示UR放在这可不可以啊,你看放在这儿会给我们怎么显示,会给我们原封不动的以实体的方式这样去显示,而没有解析这个,所以我们数据库里边就接口部我们返回来的,如果带着填标签的,我们先把内容放在。嗯,放在模板里边,我们尽量用这样的语法去放,它可以把我们解析成这样,而直接插值的带有的我们是解决不了的,对吧,比如说我们前面学过的图标啊,对吧,你如果在这个里边。嗯,图标假如。符号H,嗯,H2,然后我给你家的样式,比如说安德符NBT分号空格之类的A对不对,你看B,你看这样吧。会给我们写什么样的?这个会给我们显示空格,但是如果是变量里边使用这个是不行的,对不对,那我们就得用差值的方式去加上就可以了,也就是经常我们副文本里边会返回这样的事情都会给我们解析。
14:04
就用V8TM,所以这个用的也很多,处理的情况就是处理我们返回的数据里边带有HTM标签或者是HTM实体的这样的情况,我们用V8RTM。所以微T类似于我们GS里边因什么因T对吧,和解块里边的方法是这样,解块太的方法类似。那这就是我们这节课的呃,内容模板基本语法插值和指令插值呢,是用双括号在我们呃模板里边去把数据插入进来,那指定的是用VR加上不同的名称有不同的作用,然后呢,把数据插入到我们的模板里面,是这个概念啊好,谢谢大家,这节课我们就讲到这里。
我来说两句