能否为Pug Mixin创建别名?复杂Mixin内重写Mixin行为需求
如何为Pug Mixin创建别名并在复杂Mixin中覆盖其行为
可以通过保存原Mixin的引用到变量,再在复杂Mixin的作用域内覆盖原Mixin标识符的方式实现需求。你提供的代码无法运行的核心问题是:传递给复杂Mixin的块会在外部作用域解析,内部定义的新Mixin无法影响块内的调用。
下面是可行的实现方案:
//- 通用Mixin库 mixin input(inputObj) input(type="text" name=inputObj.name placeholder=inputObj.name) //- 复杂Mixin mixin complex // 保存原input Mixin到别名,作为原逻辑的备份 - const _baseInput = input; // 定义新的input逻辑,覆盖原标识符 - function input(inputObj) { // 添加自定义扩展行为:比如包裹容器和标签 div(class="complex-input-group") span(class="input-label") #{inputObj.name} // 调用原Mixin的核心逻辑 +_baseInput(inputObj) - } // 渲染传入的块,此时块内的+input会使用当前作用域的新逻辑 block //- 调用示例 // 使用基础版input +input({name:'基础输入框'}) // 进入复杂Mixin的作用域 +complex // 这里的+input会使用复杂版的逻辑 +input({name:'复杂场景输入框'})
原理说明
- Pug的Mixin本质是JavaScript函数,因此可以像普通函数一样将其赋值给变量(比如
_baseInput),作为原逻辑的别名备份。 - 在复杂Mixin内部,重新定义
input标识符为新的函数,实现自定义行为后再调用原逻辑。 - 传入复杂Mixin的
block会在当前Mixin的作用域内渲染,因此块内的+input()会优先使用局部作用域中定义的新函数,而非全局的基础Mixin。
内容的提问来源于stack exchange,提问作者Scott Casey
相关产品推荐
相关产品推荐

