layui的layui-icon-loading图标不会旋转

是的，layui的layui-icon-loading图标本身并不具备旋转的功能。不过，你可以通过CSS动画来实现旋转的效果。以下是一个简单的示例：

HTML代码：

<i class="layui-icon layui-icon-loading"></i>

CSS代码：

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.layui-icon-loading {
    animation: spin 1s linear infinite;
}

在这个示例中，我们定义了一个名为spin的CSS动画，它使元素沿着360度旋转一周。然后，我们将该动画应用于layui-icon-loading类，使其旋转起来。你可以根据自己的需求修改动画的速度、方向等参数。

相关问题

var vue = new Vue({ el: '#header', data: { iconArr: ['layui-icon-gift','layui-icon-email','layui-icon-logout','layui-icon-transfer','layui-icon-slider','layui-icon-print','layui-icon-cols','layui-icon-snowflake','layui-icon-note','layui-icon-flag','layui-icon-theme','layui-icon-website','layui-icon-console','layui-icon-face-surprised','layui-icon-template-1','layui-icon-app','layui-icon-read','layui-icon-component','layui-icon-file-b','layui-icon-unlink','layui-icon-tabs','layui-icon-form','layui-icon-chat'], indexNav: indexNav, adminurl: adminurl, projectName: projectName, }, mounted: function() { this.bindClickOnLi(); }, created() { this.iconArr.sort(()=>{ return (0.5-Math.random()) }) }, methods: { jump(url) { jump(url) }, bindClickOnLi() { let list = document.getElementsByTagName("li"); for(var i = 0;i<list.length;i++){ list[i].onclick = function(){ $(this).addClass("current").siblings().removeClass("current"); } } } } })解释

这段代码使用 Vue.js 实现了一个页面的头部导航栏。其中，el 属性指定了 Vue 实例绑定的 DOM 元素，即 id 为 header 的元素。data 属性定义了 Vue 实例的数据，包括 iconArr 数组，其中包含了多个 layui-icon 的类名，用于渲染页面中的图标；indexNav 对象，用于渲染页面的导航栏菜单；adminurl 和 projectName 分别表示后台管理系统的地址和项目名称。mounted 钩子函数表示 Vue 实例已经挂载到 DOM 上时触发的函数，其中调用了 bindClickOnLi 方法，用于为导航栏的 li 元素绑定点击事件。created 钩子函数表示 Vue 实例创建时触发的函数，其中使用 sort 方法对 iconArr 数组进行随机排序。methods 属性定义了 Vue 实例的方法，包括 jump 方法，用于实现页面跳转；bindClickOnLi 方法，用于为导航栏的 li 元素绑定点击事件并添加选中样式。

我希望我点击注册的时候跳转到regist.html页面，用layui的方式实现，<div class="layui-container"> <div class="admin-login-background"> <div class="layui-form login-form"> <form class="layui-form" action=""> <div class="layui-form-item logo-title"> <h1>用户登录</h1> </div> <div class="layui-form-item"> <label class="layui-icon layui-icon-username" for="username"></label> <input type="text" name="email" lay-verify="required|account" placeholder="邮箱" autocomplete="off" class="layui-input" value="admin"> </div> <div class="layui-form-item"> <label class="layui-icon layui-icon-password" for="password"></label> <input type="password" name="password" lay-verify="required|password" placeholder="密码" autocomplete="off" class="layui-input" value="123456"> </div> <div class="layui-form-item"> <label class="layui-icon layui-icon-vercode" for="captcha"></label> <input type="text" name="captcha" lay-verify="required|captcha" placeholder="图形验证码" autocomplete="off" class="layui-input verification captcha" value="xszg"> <div class="captcha-img"> <img id="captchaPic" src="../images/captcha.jpg"> </div> </div> <!-- <div class="layui-form-item"> <input type="checkbox" name="rememberMe" value="true" lay-skin="primary" title="记住密码"> </div> --> <div class="layui-form-item"> <button class="layui-btn layui-btn layui-btn-normal layui-btn-fluid" lay-submit="" lay-filter="login">登 录</button> </div> <div class="layui-form-item"> <button class="layui-btn layui-btn layui-btn-normal layui-btn-fluid" lay-submit="" lay-filter="regist">注 册</button> </div>

可以在 "注册" 按钮的标签上添加一个 onclick 事件，来实现点击跳转到 regist.html 页面。具体代码如下：

<button class="layui-btn layui-btn layui-btn-normal layui-btn-fluid" lay-submit="" lay-filter="regist" onclick="location.href='regist.html'">注 册</button>

这样点击注册按钮时就会跳转到 regist.html 页面了。