天天看點

zurb是什麼網站_Zurb的Tribute庫的Vue.js包裝器,用于本機@mentions

zurb是什麼網站

緻敬 (vue-tribute)

A Vue.js wrapper for Zurb's Tribute library for native @mentions.

Zurb的Tribute庫的Vue.js包裝器,用于本機@mentions。

View demo 檢視示範 View Github 檢視Github

安裝 (Install)

$ yarn add vue-tribute
           

or

要麼

$ npm install vue-tribute --save
           

or include the UMD build, hosted by unpkg in a

<script>

tag.

或将unpkg托管的UMD建構包含在

<script>

标記中。

<script src="//unpkg.com/vue-tribute" />
           

用法 (Usage)

Import and register the component.

導入并注冊元件。

import VueTribute from 'vue-tribute'

export default {
  ...
  components: {
    VueTribute
  }
}
           

In your template, wrap an

input

,

textarea

or

contenteditable

element in the

vue-tribute

component, and pass your Tribute options in.

在模闆中,将

input

textarea

contenteditable

元素包裝在

vue-tribute

元件中,然後傳遞Tribute選項。

<div>
  <vue-tribute :options="tributeOptions">
    <input type="text" placeholder="@..." />
  </vue-tribute>
</div>
           

See the available Tribute options here.

在此處檢視可用的Tribute選項。

大事記 (Events)

Tribute broadcasts two events — a

tribute-replaced

event, and a

tribute-no-match

event (see docs here). Listeners for these events can be attached directly to the child element of the

<vue-tribute>

component. Eg:

Tribute廣播兩個事件-一個

tribute-replaced

事件和一個

tribute-no-match

事件(請參閱此處的文檔)。 這些事件的偵聽器可以直接附加到

<vue-tribute>

元件的子元素。 例如:

<vue-tribute :options="options">
  <input type="text" placeholder="@..." @tribute-no-match="noMatchFound" />
</vue-tribute>
           

發展曆程 (Development)

# To run the example
$ npm run example

# To run the tests
$ npm test

# To publish the dist file
$ npm run build
           
翻譯自: https://vuejsexamples.com/a-vue-js-wrapper-for-zurbs-tribute-library-for-native/

zurb是什麼網站