将单选按钮转换为星星

时间:2017-11-15 04:00:13

标签: html css reactjs

我有一些单选按钮,我试图转换为星星,我按照这些示例创建星级评分:https://codepen.io/muhammad_mabrouk/pen/bWybwX

我还在学习反应,所以我不知道如何在这个组件中导入bootstrap。我需要导入的是:

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

以下是代码:

&#13;
&#13;
import { Component } from 'react'
import React from 'react';
import PageTemplate from './PageTemplate'
import '../css/starRating.css';

class Rating extends Component {

    render(){
        return (
          <div>
            <input id="star-5" type="radio" name="rating" value="star-5"></input>
            <label for="star-5" title="5 stars">
                <i class="active fa fa-star" aria-hidden="true"></i>
            </label>
            <input id="star-4" type="radio" name="rating" value="star-4"></input>
            <label for="star-4" title="4 stars">
                <i class="active fa fa-star" aria-hidden="true"></i>
            </label>
            <input id="star-3" type="radio" name="rating" value="star-3"></input>
            <label for="star-3" title="3 stars">
                <i class="active fa fa-star" aria-hidden="true"></i>
            </label>
            <input id="star-2" type="radio" name="rating" value="star-2"></input>
            <label for="star-2" title="2 stars">
                <i class="active fa fa-star" aria-hidden="true"></i>
            </label>
            <input id="star-1" type="radio" name="rating" value="star-1"></input>
            <label for="star-1" title="1 star">
                <i class="active fa fa-star" aria-hidden="true"></i>
            </label>
          </div>
        );
    }
}

export default Rating;
&#13;
&#13;
&#13;

我将非常感谢你的帮助。

1 个答案:

答案 0 :(得分:1)

你需要放置这个:

encrypter = pyaes.AESModeOfOperationCBC(key, vector)
encrypted = cipher.encrypt('Hello world !!!!')
print(encrypted)
# ?Eg?m??K?(|
decrypter = pyaes.AESModeOfOperationCBC(key, vector)
decrypted = decrypter.decrypt(encrypted)
# Hello world !!!!

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> 文件夹中,public文件。

OR

下载该文件并将其存储在本地,然后将其与index.html

一起放置

然后导入starRating.css

starRating.css