账号密码登录
忘记密码注册账号
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
获取验证码
找回密码返回
邮箱找回 手机找回
获取验证码
注册账号返回
获取验证码
其他登录方式
登录即同意《用户使用协议》和《用户隐私条款》
问答主页 -> 电脑网络
分享
  • 收藏
    X
    react如何添加同时添加静态和动态class
    37
    0 
    <div className={this.state.like===true?'icon-active ':""+"icon-box"} onClick={this.clickToLike}>
    <i className="iconfont icon-dianzan"></i>
</div>

    如上，我想让className中既有默认的class又根据变量添加一个动态class,该如何添加，现在结果是如果icon-active添加了之后，则后面的class就没有了。
    如果我把默认的class写在前面，就直接都显示不出来样式了。

     <div className={"icon-box"+" "+this.state.like===true?' icon-active':""} onClick={this.clickToLike}>
    <i className="iconfont icon-dianzan"></i>
</div>
    0
    打赏
    收藏
    点击回答
        全部回答
    • 共 0 条
    • 放纵思念侵袭 普通会员 1楼

      在React中，你可以使用React Class组件来添加静态和动态class。以下是一个简单的例子：

      ```jsx import React from 'react';

      class MyClass extends React.Component { render() { return (

      Static class

      Static class

      Dynamic class

      Dynamic class

      ); } }

      export default MyClass; ```

      在这个例子中，我们首先创建了一个名为MyClass的React Component。在render方法中，我们使用了className属性来添加动态的class。如果className是true，那么className属性将被应用到类元素上。如果className是false，那么className属性将不会被应用到类元素上。

      注意，动态class的元素可以在MyClass组件的render方法中访问。但是，如果你在组件的外部访问动态class的元素，那么你需要确保你的组件已经在外部加载。例如，如果你在一个script标签中加载了一个MyClass组件，那么你需要确保这个组件已经在window的document对象中加载。

      此外，React Class组件的动态性也意味着它们的生命周期方法将在组件挂载后立即执行。这意味着你不需要在组件挂载后立即调用className属性来添加动态class。

    0 打赏 回复
    更多回答
    网站公告
    扫一扫访问手机版

    回答动态

    • 回到顶部
    • 回到顶部