ivew使用星星评分
这组件好像有问题,不知道是我们项目环境造成的还是什么,初始化半星不能正常显示,显示的全星。
1.template
<div style="display:inline-block;margin-right:100px;vertical-align:3px;">
<span style="font-size:16px;color:#fff;line-height:20px;vertical-align:-3px;">评分:</span>
<Rate allow-half show-text v-model="startValue" @on-change='getScore'><span style="color: #f5a623;display: inline-block;width: 30px;">{{ startValue}}分</span></Rate>
</div>
2.在data中设置星星的数量绑定
data () {
return {
startValue: 0, // 评分级别
score: 0, // 评分级别
}
}
3.methods
可以通过on-change触发星星改变事件
// 得到分数
getScore () {
this.score = this.startValue
},
ivew使用星星评分的更多相关文章
- HTML5商城开发三 jquery 星星评分插件
展示:
- angularjs实现星星评分
angularjs实现星星评分 自定义指令 app.directive('myStars', function () { return { require : '?ngModel', // ?ngMo ...
- js点亮星星评分并获取参数的js代码
点亮星星评分后,点击按钮,立即获得分数参数值,方便不想使用ajax传参的朋友 http://demo.jb51.net/js/2014/jsxxdf/demo2.html <!DOCTYPE h ...
- vue2.0:(九)、外卖App弹窗部分星星评分
本篇是星星评分部分,先上代码: 1.header.vue: <template> <transition name="fade"> & ...
- Android星星评分控件RatingBar的使用
在Android的开发中,有一个叫做评分控件RatingBar,我们可以使用该控件做等级划分.评分等作用,星星形状显示,也可以半星级别,我们来看一下评分控件如何使用. 布局文件中定义控件以及属性,这里 ...
- 微信小程序——星星评分
先来个效果图镇楼: 实现原理: 1.循环需要评分的列表,判断它的分数 与 当前星星索引的大小: 2.点击,获取星星对应的分数,让星星高亮. 代码: star.wxml: <view class= ...
- vue 星星评分组件
显示评分和打分组件,可现实半颗星星效果 效果图: 参数名 类型 说明 score Number 分数 ,默认0,保留一位小数 disabled Boolean 是否只读,默认false,鼠标点击可以打 ...
- wex5中的星星评分
新建一个空白的.w文件,然后在页面上放5个img星星图片 重要的是图片路径不能是绝对路径,要用相对路径,不然js操作的时候会出bug 添加两个label标签(标签随你挑,在这我就用label) 你到时 ...
- jQuery实现星星评分功能
一.这是我做的调查问卷中的一个功能.(第三方MVC框架) 二.功能说明:1.用户点击星星,将值放到隐藏域中.2.用户可以重新点击星星修改回答. 前台JS代码: <script type=&quo ...
随机推荐
- 洛谷 P2548 [AHOI2004]智能探险车
P2548 [AHOI2004]智能探险车 题目描述 输入输出格式 输入格式: 输出格式: 输入输出样例 输入样例#1: 复制 4 3 sunny plain full many sunny moun ...
- 关于Activiti的工作流选型
1. 引言 由于Activiti面世出现也比较早,加上是Java领域的开源工作流,自然而然也被很多企业个人拿来使用,有做做简单的或有深入的二次开发使用的.作为一个资深的BPM领域技术专家,貌似如果没有 ...
- Clojure:添加gzip功能
利用现有的插件,在Clojure中添加gzip的功能是很方便的.1. 在project.clj中添加对bk/ring-gzip插件的依赖.:dependencies [bk/ring-gzip ...
- 前端页面a标签嵌套a标签效果的两种解决方案
这是由工作中的一个小改动需求得到的这个解决方案的:那个需求是这样的,如图: 需求原来是球队名字没有点击功能的,而蓝色方框两队之间的比赛点击的时候会跳转到比赛文字直播页面.现在需要要求点击球队名字要跳转 ...
- 从头认识Spring-2.7 自己主动检測Bean(1)-@Component @Repository @Service @Controller
这一章节我们来讨论一下自己主动检測Bean. 1.domain 厨师类: package com.raylee.my_new_spring.my_new_spring.ch02.topic_1_19; ...
- luogu2320 鬼谷子的钱袋
题目大意 鬼谷子决定将自己的金币数好并用一个个的小钱袋装好,以便在他现有金币的支付能力下,任何数目的金币他都能用这些封闭好的小钱的组合来付账.求钱袋数最少,并且不有两个钱袋装有相同的大于1的金币数的装 ...
- 二分图染色模板(P1330 封锁阳光大学)
二分图染色模板(P1330 封锁阳光大学) 题目描述 曹是一只爱刷街的老曹,暑假期间,他每天都欢快地在阳光大学的校园里刷街.河蟹看到欢快的曹,感到不爽.河蟹决定封锁阳光大学,不让曹刷街. 阳光大学的校 ...
- form内部的button_to不submit
创建: 2017/09/12 更新: 2018/03/17 修正因为博客迁移造成的格式问题 官方文档 http://railsdoc.com/references/button_to 参考文档 htt ...
- nodejs express开发
用NodeJS+Express开发WEB应用---第一篇 大漠穷秋2014-03-28 预热 为了对后面的内容理解更加透彻,推荐首先阅读下面这篇很好的文章: http://www.nodebeginn ...
- set()集合的概念与一般操作
1.概念 set集合是python的一种基本数据类型,其特点为: 1.元素不重复(可以利用这条性质除去重复元素) 2.在集合中无序 3.元素可hash(int,str,bool,tuple) set集 ...