dy-wheel-rem

一个可能好用的大转盘包,整合一个vue大转盘包, 素材等参考某个开源作者..如有雷同 纯属巧合

Usage no npm install needed!

<script type="module">
  import dyWheelRem from 'https://cdn.skypack.dev/dy-wheel-rem';
</script>

README

dy-wheel-rem

Project setup

npm install

Project Usage

1、load all

import Wheel from 'dy-wheel-rem'

2、load compoment

import { Wheel } from 'dy-wheel-rem'
import 'dy-wheel-rem/lib/dy-wheel-rem.css';
Vue.use(Wheel)

in your vue compoment ,for example

app.vue

...
    <div>
        <d-wheel></d-wheel>
    </div>
    
    or like this
    
        <div>
            <d-wheel
                api='http://yourapi.com'
                @prizeConfig="config"
            ></d-wheel>
        </div>
        
    for more information about config, look at below~~    
...

API

In the first version, d-wheel works on your local env, but i open the api feature, that alow you send request to server

api: your api
prizeConfig: your prize config, is array, length is equal 8

[
    {
        img: your prize image,
        position: '1',
        title: '奖励1'
    },
    {
        img: your prize image,
        position: '2',
        title: '奖励2'
    },
    ...
]

events: capture return prize object

        <div>
            <d-wheel
                api='http://yourapi.com'
                @prizeConfig="config"
                @prize-result="onPlayFinished"
            ></d-wheel>
        </div>

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Run your tests

npm run test

Lints and fixes files

npm run lint

Run your unit tests

npm run test:unit

Customize configuration

See Configuration Reference.