推薦一款簡易的solid?js消息UI庫使用詳解
更新時間：2022年08月29日 08:37:25 作者：超級大柱子
這篇文章主要為大家介紹了推薦一款簡易的solid-js消息UI庫使用詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
???? solid-msg
今天推薦一款簡易的 solid-js 的消息 UI 庫
特性:
- 使用 twind 處理 css
- 進(jìn)度條 bar
- 易于使用
- 易于定制
- 輕量, 僅
1.5kbin gzip
快速開始
安裝:
pnpm i "solid-msg"
在 Solid 工程中使用:
import { solidMsg } from "solid-msg";
solidMsg.light("hello solid-msg")
調(diào)整配置
import { solidMsg } from "solid-msg";
solidMsg.setOptions({
positon:"center",
clickCardClose: true,
closeButton: false,
progress: false,
width: "500px",
padding: "20px",
});
solidMsg.light("hello solid-msg")
自定義消息內(nèi)容
import { solidMsg } from "solid-msg";
solidMsg.light(
<div>
<h2>the title</h2>
<div>the message</div>
</div>
);
自定義消息卡片
import { solidMsg } from "solid-msg";
solidMsg.setOptions({
Component: MsgComponent,
});
const MsgComponent: Component<{
id: string;
msg: any;
type: MsgType;
duration: number;
}> = (p) => {
return (
<div>
<div>Your custom message card</div>
<div>{p.msg}</div>
</div>
);
};以上就是推薦一款簡易的solid-js消息UI庫使用詳解的詳細(xì)內(nèi)容，更多關(guān)于solid-js消息UI庫的資料請關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
這篇文章主要介紹了詳解vue-cli@2.x項目遷移日志，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-06-06
這篇文章主要為大家詳細(xì)介紹了Vue下拉選擇框Select組件的使用，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-03-03
教你在Vue3中使用useStorage輕松實現(xiàn)localStorage功能
這篇文章主要給大家介紹了關(guān)于如何在Vue3中使用useStorage輕松實現(xiàn)localStorage功能的相關(guān)資料,文中通過實例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2023-06-06
這篇文章主要介紹了詳解服務(wù)端預(yù)渲染之Nuxt（介紹篇）,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-04-04
本篇文章主要介紹了詳解vue slot插槽的使用方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-06-06
今天小編就為大家分享一篇vue添加axios,并且指定baseurl的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09
最近正在使用Pinia進(jìn)行狀態(tài)管理,我希望在重新刷新頁面時保持狀態(tài),下面這篇文章主要給大家介紹了關(guān)于Pinia簡單使用以及數(shù)據(jù)持久化的相關(guān)資料,需要的朋友可以參考下2022-05-05
這篇文章主要介紹了在vue3中安裝使用bootstrap過程,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10
vue?watch監(jiān)聽觸發(fā)優(yōu)化搜索框的性能防抖節(jié)流的比較
這篇文章主要為大家介紹了vue?watch監(jiān)聽觸發(fā)優(yōu)化搜索框的性能防抖節(jié)流的比較,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-10-10
在現(xiàn)代 Web 應(yīng)用中,快速分享鏈接是一項常見需求,二維碼作為一種簡潔的分享方式,受到了廣泛歡迎,所以本文將介紹如何使用 Vue 純前端技術(shù)實現(xiàn)動態(tài)生成鏈接二維碼的方法,需要的可以參考下2024-03-03