npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

mycompoinss

v3.18.0

Published

混合组件

Downloads

2

Readme

介绍

模板项目分位3大模块

editor 一个组件的编辑器
preview 开发这个组件的时候的运行环境
src 组件的核心代码

image.png

为了便于维护和扩展,我们觉得一个组件的可配置数据包括简单数据,复杂逻辑数据,对应可编辑属性的部分也分为两部分

  1. 编辑器提供基础属性编辑 (系统默认支持)
/**
 * 
 * @param type: 字段类型,支持原生类型以及【码良输入类型】
 * 
 * 码良输入类型: 
 * input    单行输入框
 * text     多行输入框
 * enum     列表单选    需提供选项字段defaultList, 支持数组、map结构
 * image    图片选择
 * audio    音频选择
 * video    视频选择
 * richtext 富文本 
 * number   数字
 * function 方法设置
 * data     json数据
 * date     时间选择
 * checkbox 多选框      同enum 不提供defaultList字段时,输入值为布尔类型
 * radio    单选框      同enum
 * 
*/

  1. 编辑器能提供扩展编辑编辑能力(editor),主要针对运营方便操作,特征性的开发组件属性的编辑功能,提供对运营友好的操作体验

核心数据流向

image.png

组件的核心是通过传入的数据进行不同的逻辑处理和显示, 而编辑器通过你自己编写的页面对组件的数据进行修改, 最终编辑器修改数据,组件同步更改显示,预览器则是提供在开发过程中的一个环境,用来提供默认数据。