小编Bee*_*ees的帖子

如何在 React App 中显示表情符号

我想在我的网页上的 React 聊天应用程序中显示表情符号。计划是为用户提供一个表情符号列表以供选择。如何使用像“1F683”这样的代码并让它们在页面上显示表情符号?我需要支持 Chrome。

我可以使用 css 来显示表情符号。

<div className="smiley"></div>

.smiley:after {
    content: "\01F683";
}
Run Code Online (Sandbox Code Playgroud)

我还可以有一个图像列表并将它们映射到代码并为每个表情符号显示一个 img 元素。

有没有另一种方法,哪种方法是最好的方法?

css unicode emoji reactjs

6
推荐指数
2
解决办法
3万
查看次数

Bootstrap 4 导航栏活动后台颜色

在 Bootstrap 3 导航栏中,当链接处于活动状态时,链接背景颜色会更改以显示其处于活动状态。这似乎在 Bootstrap 4 中缺失。有没有办法显示这一点,或者我是否需要覆盖活动类?

Bootstrap 3 导航栏如下所示。您可以看到活动主页链接已突出显示如何在 Bootstrap 4 中显示此链接。

在此处输入图片说明

下面的angular 5代码

  <div class="navbar-collapse" [ngbCollapse]="navbarCollapsed" id="navbarContent">
    <ul class="nav navbar-nav mr-auto">
      <li class="nav-item" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}">
        <a class="nav-link" [routerLink]="['/home']" (click)="navbarCollapsed = true">HOME</a>
      </li>
      <li class="nav-item" [routerLinkActive]="['active']">
        <a class="nav-link" [routerLink]="['/page1']" (click)="navbarCollapsed = true">Page 1</a>
      </li>
    </ul>
  </div>
Run Code Online (Sandbox Code Playgroud)

navbar bootstrap-4 ng-bootstrap angular

5
推荐指数
1
解决办法
1万
查看次数

标签 统计

angular ×1

bootstrap-4 ×1

css ×1

emoji ×1

navbar ×1

ng-bootstrap ×1

reactjs ×1

unicode ×1