Leafer

用于创建Leafer组件。

基础用法

0px x 0px

App.vue

Import Map

xxxxxxxxxx

35

 

1

<script setup lang="ts">

2

import { LeaferApp } from 'leafer-vue'

3

import { ref } from 'vue'

4

​

5

const amplitude = 150

6

let direction = 1

7

const y = ref(100)

8

function animate() {

9

  if (y.value > amplitude)

10

    direction = -1

11

  else if (y.value < 50)

12

    direction = 1

13

​

14

  y.value += direction

15

  requestAnimationFrame(animate)

16

}

17

requestAnimationFrame(animate)

18

</script>

19

​

20

<template>

21

  <LeaferApp :width="672" :height="340" type="draw">

22

    <Leafer>

23

      <Text

24

        text="Hello Leafer Vue"

25

        fill="#66A659"

26

        font-weight="black"

Show Error

属性

名称	类型	默认值	说明
width	number	——	宽度
height	number	——	高度
pixelRatio	number	1	像素比
fill	string	——	填充色
hittable	boolean	true	是否响应交互事件

更多属性请查看Leafer |🌿 Leafer UI

事件请查看事件处理 |🌿 Leafer Vue