前面都是基础知识,可能比较枯燥,但是千万不要着急,小鲜我曾经就是因为跨不过基础这关,急于求成,走了许多弯路,有任何问题恳请大家问我,留言或者私信都可以,我会很耐心的回答的,前面的基础打牢了,后面做开发就会如鱼得水
一.前言
在许多网页中,我们都会发现网页某一部分的结构是一模一样的,这样如果每次都编写重复的网页结构代码,是不人道的,所以在许多前端开发中都会通过各种各样的方法实现重复网页结构代码的复用,比如vue中的组件等,在小程序中引入了模板的概念来实现重复结构代码的复用.
二.模板
1.模板的定义:通过template标签定义模板,通过给name属性赋值定义模板的名称,通过在template标签中嵌套网页结构代码,实现模板内容.
2.模板的使用:通过template标签使用模板,通过给is属性赋值模板名称指定使用的模板,通过给data属性赋值...对象名称,在模板中使用数据对象中的内容,其中...是用来解构对象的,通过...,我们可以在模板的定义中直接通过{{key}}来访问对象中数据的内容
三.文件引用
在上一节定义模板中,,模板的定义和使用都在同一个文件中,也就是index.wxml文件,非常的不利于阅读,这里再当前网页目录下新建一个template目录,用于当前页面模板的定义,新建一个common目录,用于当前页面的结构代码复用.
1.通过import单标签引入当前页面要使用的模板,通过给src属性赋值定义模板文件的地址,但是import只能引入文件中的模板,不能引入其它内容,通常放在当前页面文件的开头
这里要注意通过import单标签引入文件,不仅只会引入template内容,而且只会引入当前文件的模板内容,不会引入当前文件引入其它文件的模板.
2.通过include单标签引入,通过给src属性添加引入.wxml文件地址,将文件中的内容原封不动的拷贝到引入的位置,会拷贝文件中的所有内容,通常里面不定义模板,只书写需要复用的结构代码,比如多个页面的头部和底部信息一致,可以单独写成header.wxml和footer.wxml文件,实现复用.
