Недавно Meituan выпустила фреймворк с открытым исходным кодом, который может использовать Vue для разработки небольших программ.mpvue, выглядит довольно хорошо, я думаюwepyОпыт развития не очень хорош, поэтому я все еще с нетерпением жду этой новой структуры. Я написал тост, основанный на MPVUUE, в основном для проверки воды, а общий опыт развития все еще очень хорош. Опубликуйте это первымгитхаб-адрес, Если вам интересно, вы можете посмотреть. Если вам это нравится, пожалуйста, дайте ему звезду ~

В основном это вопросы:

• У апплета, похоже, нет API для динамического добавления узлов, поэтому его можно сделать только в форме компонента, а форма API пока не поддерживается.
• Переход не работает, поэтому анимация требует других реализаций
• Атрибут ref недоступен, если вы хотите получить доступ к свойствам и методам дочерних компонентов, вам, возможно, придется передать$children
• Глобальные компоненты в настоящее время не поддерживаются
• После публикации в npm основное поле должно указывать на файл .vue для нормальной сборки, указывать на файл js, а затем вызывать ошибку сборки файла vue в файле js.issue33

Код также относительно прост, поэтому я не буду его объяснять, просто используйте ридми, чтобы составить количество слов~

mpvue-toast

mpvue-toast is a toast plugin for mpvue.

Screenshots

Install

npm install mpvue-toast --save

Usage

<template>
  <div>
    <toast message="hello from toast" :visible.sync="visible"></toast>
    <button @click='setVisible(false)'>toggle toast</button>
    <!-- <toast message="hello from toast" :visible.sync="visible" :img="img"></toast> -->
    <!-- <toast message="hello from toast" :visible.sync="visible" icon-class="iconfont icon-shoucang"></toast> -->
  </div>
</template>

<script>
import toast from 'mpvue-toast'
// import img from 'img.jpg'
// import '@/icon.css'

export default {
  data () {
    return {
      visible: false,
      // img
    }
  },

  components: {
    toast
  },

  methods: {
    setVisible() {
      this.visible = !this.visible
    }
  },
}
</script>

Props

параметр	иллюстрировать	Типы	необязательное значение	По умолчанию
animate	Включена ли анимация	Boolean	-	true
transition	Тип анимации, теперь поддерживаетсяslide fade	String	slide fade	slide
duration	Toastпродолжительность в миллисекундах	Number	-	2000
message	ToastСодержание	String	-	-
className	Toastсорт	String	-	-
img	картина	String	-	-
iconClass	Класс Icon, вы можете использоватьiconfont	String	-	-
position	ToastПоложение отображения	String	-	center
visible	контрольToastдисплей, поддержкаsync	Boolean	-	-

TODO

• [ ] test
• [ ] api

Other Component

• mpvue-ripple