Thymeleaf 自定义标签

冷不防 2022-10-01 13:51 300阅读 0赞

本文介绍自定义标签，使用的环境为，

spring-boot-starter-parent 版本为  1.5.10.RELEASE   使用的 Thymeleaf 的版本是 3.0.9.RELEASE

如果使用的  spring-boot-starter-parent 为 2.0 以上 则使用 Thymeleaf 的版本则是4以上

按照上面版本的说明，首先先把Thymeleaf 的版本进行升级

![20190612141345254.png][]

注意一定需要升级，不然会报错，下面是依赖

<dependency>
                    <groupId>net.sourceforge.nekohtml</groupId>
                    <artifactId>nekohtml</artifactId>
                    <version>${nekohtml.version}</version>
                </dependency>
                <dependency>
                    <groupId>org.thymeleaf</groupId>
                    <artifactId>thymeleaf-spring4</artifactId>
                    <version>${thymeleaf.version}</version>
                </dependency>
                <dependency>
                    <groupId>nz.net.ultraq.thymeleaf</groupId>
                    <artifactId>thymeleaf-layout-dialect</artifactId>
                    <version>${thymeleaf-layout-dialect.version}</version>
                </dependency>
    
                <thymeleaf.version>3.0.9.RELEASE</thymeleaf.version>
                <thymeleaf-layout-dialect.version>2.3.0</thymeleaf-layout-dialect.version>
                <nekohtml.version>1.9.22</nekohtml.version>

首先进行配置，配置在页面导入的 名称空间的 标签前缀

创建一个类并且继承  AbstractProcessorDialect 该类 ，该类是一个默认的方言处理器，重写下面的 构造函数和方法

/**
     * 系统方言
     */
    public class SysDialect  extends AbstractProcessorDialect {
        // 定义方言名称
        private static final String DIALECT_NAME = "Sys Dialect";
        /**
         * 构造函数
         */
        public SysDialect() {
            // 设置自定义方言与“方言处理器”优先级相同
            /*
            * DIALECT_NAME : 表示 设置的方言的名称
            * sys ： 表示在页面使用的标签的名称  是在名称空间中声明的 部分
            * */
            super(DIALECT_NAME, "thSys", StandardDialect.PROCESSOR_PRECEDENCE);
        }
    
        @Override
        public Set<IProcessor> getProcessors(String dialectPrefix) {
            Set<IProcessor> processors = new HashSet<IProcessor>();
    
            // 添加自定义标签
            processors.add(new SysDictTagProcessor(dialectPrefix));
            processors.add(new StandardXmlNsTagProcessor(TemplateMode.HTML, dialectPrefix));
            return processors;
        }
    }

设置完成之后，下面开始创建，名称空间前缀 调用的 具体的标签名称和功能

创建一个类，继承  AbstractElementTagProcessor ，标签元素处理器 ，该类也需要重写构造函数和具体的方法

/**
     * 创建标签  具体的 标签
     */
    public class SysDictTagProcessor extends AbstractElementTagProcessor {
        // 标签名
        private static final String TAG_NAME = "dict";
    
        // 优先级
        private static final int PRECEDENCE = 10000;
    
        public SysDictTagProcessor(String dialectPrefix) {
            super(
                    // 此处理器将仅应用于HTML模式
                    TemplateMode.HTML,
    
                    // 要应用于名称的匹配前缀
                    dialectPrefix,
    
                    // 标签名称：匹配此名称的特定标签 该内容就是在使用名称空间调用的 标签
                    TAG_NAME,
    
                    // 将标签前缀应用于标签名称
                    true,
    
                    // 无属性名称：将通过标签名称匹配
                    null,
    
                    // 没有要应用于属性名称的前缀
                    false,
    
                    // 优先(内部方言自己的优先)
                    PRECEDENCE
            );
    
        }
    
        @Override
        protected void doProcess(ITemplateContext iTemplateContext, IProcessableElementTag
                iProcessableElementTag, IElementTagStructureHandler iElementTagStructureHandler) {
           // 首先 引入 server 进行数据的查询，但是在引入bena 的时候，会报错，因为当前类不是server类，所以需要
    //        创建类，然后使用上下文，获取相应的bena
            ApplicationContext applicationContext = SpringContextUtils.getApplicationContext(iTemplateContext);
            DictService dictService = applicationContext.getBean(DubboUtils.class).getDictService();
    
            //  获取前端页面传递的属性
            String type = iProcessableElementTag.getAttributeValue("type");
            String name = iProcessableElementTag.getAttributeValue("name");
            String classStyle = iProcessableElementTag.getAttributeValue("class");
            // 进行数据的查询 根据 type 查询
            List<Dict> dictByType = dictService.getDictByType(type);
            if(dictByType != null && dictByType.size() >0){
                // 创建标签
                IModelFactory modelFactory = iTemplateContext.getModelFactory();
                IModel model = modelFactory.createModel();
                model.add(modelFactory.createOpenElementTag(String.format("select name='%s' class='%s'",name,classStyle)));
                for (Dict dict : dictByType) {
                    model.add(modelFactory.createOpenElementTag(String.format("option value='%s'",dict.getValue())));
                    model.add(modelFactory.createText(dict.getLabel()));
                    model.add(modelFactory.createCloseElementTag("option"));
                }
                model.add(modelFactory.createCloseElementTag("select"));
    
                iElementTagStructureHandler.replaceWith(model,false);
            }
        }
    }

可以将具体的功能，在  doProcess 方法中写，并最后将标签进行替换

在页面中使用，本案例是在html页面中使用

首先导入名称空间

![20190612142352369.png][]

导入之后，在需要使用的位置调用该标签即可

![20190612142423233.png][]

具体的属性可以在后端直接获取到

[20190612141345254.png]: /images/20220118/be1695ece7db4d30a2eb00e6057896b3.png
[20190612142352369.png]: /images/20220118/f062a850530445109e43b5d0ff04745f.png
[20190612142423233.png]: /images/20220118/d2e5ae33c98a40d59a7aa26d1154ccaa.png