https://github.com/hairyf/vue3-local-scope

Generate fully typed local scope in the template of Vue3
https://github.com/hairyf/vue3-local-scope

Last synced: about 1 month ago
JSON representation

Generate fully typed local scope in the template of Vue3

• Host: GitHub
• URL: https://github.com/hairyf/vue3-local-scope
• Owner: hairyf
• License: mit
• Created: 2023-05-22T06:57:32.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2023-12-15T14:30:01.000Z (about 1 year ago)
• Last Synced: 2024-10-02T08:20:54.251Z (3 months ago)
• Language: TypeScript
• Size: 23.4 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# vue3-local-scope

[![NPM version](https://img.shields.io/npm/v/vue3-local-scope?color=a1b858&label=)](https://www.npmjs.com/package/vue3-local-scope)

Based on [Vue 3.3](https://blog.vuejs.org/posts/vue-3-3), Similar to [vue-local-scope](https://github.com/posva/vue-local-scope), for use in Vue 3 Local Scope with full type hints.

## Usage

Vue3 Local Scope exports two things:

- **LocalScope**: a functional component that passes any props to the scoped slot with full type hints.

- **createLocalScope**: same as [vue-local-scope#createLocalScope](https://github.com/posva/vue-local-scope/tree/master#createlocalscope).

### LocalScope

LocalScope is the same as [vue-local-scope#LocalScope](https://github.com/posva/vue-local-scope/blob/master/README.md#localscope). It renders anything passed as the scoped slot. It allows you to avoid duplicating your code and provides full types.

```html

  

  

    

    

      {{ `rotate = ${it.rotate}` }}

    

  

import { LocalScope } from 'vue3-local-scope'

import { ref } from 'vue'

const textures = ref([])

// ....

```

As it is a functional component, you can return any number of elements, and LocalScope will be invoked whenever certain content in the same template changes.

## createLocalScope

Refer to [vue-local-scope#createLocalScope](https://github.com/posva/vue-local-scope/tree/master#createlocalscope).

## License

[MIT](./LICENSE) License © 2022 [hairyf](https://github.com/hairyf)