动态创建Materialize UI滑块元素时出现空卡片问题的求助

嘿，我看了你的代码，问题大概率出在没有初始化Materialize的Slider组件上！Materialize的大部分组件都需要手动初始化才能正常渲染，尤其是动态创建DOM元素的时候——你只是把元素加到了页面里，但Materialize还没识别到它们，所以看起来就是空卡片。

先给你说核心解决办法：在动态创建完滑块的DOM结构并添加到页面后，调用Materialize的Slider初始化方法。

修改你的代码，在imgDiv.appendChild(col);这一行后面加上初始化代码：

// 初始化Materialize Slider组件
M.Slider.init(slider);

如果你的Materialize是较新的版本（比如1.0.0+），也可以这样写：

new M.Slider(slider);

另外再给你两个小检查点，确保万无一失：

• 确认img.images确实包含有效图片链接，有时候数据结构可能和预期不符，导致没生成img元素
• 检查你的DOM结构是否符合Materialize Slider的要求，你的代码里每个<li>只放img是没问题的，但如果后续要加标题之类的，记得加上caption类的容器

对了，你单图的时候正常，是因为单图可能用的是Materialboxed组件，那个你加了类名后可能自动初始化了？或者你单图的代码里有初始化步骤，多图的时候漏掉了。

试试上面的初始化步骤，应该就能看到滑块正常显示了！

备注：内容来源于stack exchange，提问作者Farid Asyraf