Raty 星级评价插件技术文档

本文档将详细介绍如何安装、使用以及通过API调用Raty星级评价插件，帮助用户更好地理解和应用该插件。

一、安装指南

Raty插件的安装可以通过以下两种方式：

1. 通过NPM安装

在命令行中运行以下命令：

npm install raty

2. 通过CDN链接

直接在HTML文件中通过<script>标签引入Raty的CDN链接：

<script src="https://cdn.jsdelivr.net/npm/raty-js@4.0.0/dist/raty.min.js"></script>

二、项目的使用说明

1. 使用图片

首先，确保引入raty.js文件以及相关的图片文件star-off.png和star-on.png。

HTML部分：

<div data-raty></div>

JavaScript部分：

const raty = new Raty(document.querySelector('[data-raty]'));

raty.init();

2. 使用字体

同样，确保引入raty.css文件以及字体文件raty.eot, raty.svg, raty.ttf, raty.woff。

HTML部分：

<link rel="stylesheet" href="raty.css">

<div data-raty></div>

JavaScript部分：

new Raty(document.querySelector('[data-raty]'), { starType: 'i' });

三、项目API使用文档

Raty插件提供了丰富的配置选项和函数接口，以下是一些常用的API调用：

配置选项

属性	默认值	描述
cancelButton	false	是否创建一个取消按钮来取消评分
number	5	将显示的星星数量
half	false	是否启用半星选择
hints	['bad', 'poor', 'regular', 'good', 'gorgeous']	每个星星的提示信息

函数接口

函数	描述
raty.score()	获取当前评分
raty.score(number)	设置评分
raty.readOnly(boolean)	改变只读状态

四、项目安装方式

Raty插件的安装方式主要有两种：

1. 通过NPM

在命令行中运行：

npm install raty

2. 通过CDN

在HTML文件中通过<script>标签引入：

<script src="https://cdn.jsdelivr.net/npm/raty-js@4.0.0/dist/raty.min.js"></script>

通过上述文档，用户可以快速上手并使用Raty星级评价插件。