Security News
NIST Misses 2024 Deadline to Clear NVD Backlog
NIST has failed to meet its self-imposed deadline of clearing the NVD's backlog by the end of the fiscal year. Meanwhile, CVE's awaiting analysis have increased by 33% since June.
@beisen-platform/transfer
Advanced tools
const props = {
data: [{
text: '', // 显示文本
role: 'left', // 显示在左框
IsCustomListNecessary:false
}],
title: {
left: '隐藏字段', // 显示标题:左侧框
right: '显示字段' // 显示标题:右侧框
},
style: {
width: '284px' // 指两侧单框的宽度
},
multiSelect: {
left: true, // 左侧框支持多选(可每次操作多项)
right: false // 设置右侧框单选(每次操作单项)
},
showAdjust: true, // 是否显示右侧上下调整按钮
disableDropLastOne: true, // 当右侧剩余一个数据时,禁止移动到左侧队列
onDragLastOne: function(){}, // 当右侧移动的是最后一个数据时的回调
onTransfer: function({left,right}){}, // 抛数据接口函数
act: {
isReset: false, // 是否更新数据
callback: function (isReset) {}
},
treeMode:false,
hiddenTip: false, // tooltips visibles 默认显示
sideTip: false, // tooltips direction 默认方向 top-bottom
}
willreceiveprops
里定义了
当且仅当,this.props.act.isReset
为false
并且 nextProps.act.isRest
为true
时引起更新
showAdjust={true}
React组件开发,并发布到北森cnpm服务器
第一步:git clone git@gitlab.beisen.co:cnpm/beisen-module-template.git
第二步:cd beisen-module-template
第三步:./renew.js 项目路径/项目名称
如执行./renew.js ../testDemo/ //**testDemo**为新项目名称,与该空项目平级,新项目不带git信息,一个纯的项目
第四步:cd ../testDemo/ //此时不带git信息的新项目testDemo建立完成
package.json
package.json
中不允许出现中文
"name": "@beisen/ComponentName",
"author": {
"name": "name",
"email": "name@beisen.com"
},
"description": "",
"keywords": [
"beisen",
"react-component",
"es6",
"karma",
"jasmine"
],
"maintainers": [
{
"name": "name",
"email": "name@beisen.com"
}
]
**组件名称(必填)---应首字母大写,若为多个单词拼接,则使用驼峰格式,如TabComponent**
**组件作者(必填)**
**组件概述(必填)**
**组件关键词(必填)eg.Form,Icon,DropDown...**
**维护人员 (必填)**
ReactComponent
—— dist
|
|—— index.js (webpack打包后的js)
|
—— examples
|
|—— preview
|—— 预览图.png (组件截图)
|
|—— index.html (可直接打开的示例)
|
—— lib (babel转换后的语法 es6 —> es5)
|
—— src
|
|—— index.js (组件源码,webpack打包入口)
|
—— tests (测试文件夹)
|
| —— index-spec.js (测试用例)
|
—— index.html (组件调用)
|
—— index.js (组件调用)
|
—— karma.conf.js (karma配置)
|
—— webpack.config.js (webpack配置)
|
—— package.json (如有依赖,必须写全)
|
—— README.md (组件使用说明,配置参数)
cnpm install
或 npm install
cnpm使用教程npm run dev
(开发环境打包 port:8080)npm run test
(测试用例)npm run build
(生产环境打包)打tag后,请同步更新package.json中的version版本号,服务器会自动
将项目同步或更新到cnpm库中,并添加官方授权,Beisen前端组件库会自动添加或更新组件信息(包含文档,示例和预览图)
应该使用0.1.0
作为初始化开发版本。
具体版本信息参考语义化版本 2.0.0
文档
,包括组件使用说明,配置参数,版本信息示例
预览图
单元测试
[组件接入story步骤]:(http://note.youdao.com/share/?id=413ccdc6cd3570e8cb202468ea0a3696&type=note#/)
项目
只能对应一个组件
react
组件,不需要redux相关内容package.json
中写全ES6
语法sass
, 2个空格缩进注释
,包括函数、参数import React, {Component, PropTypes} from 'react'
class Demo extends Component {
render() {
return <h1>hello world</h1>
}
}
Demo.propTypes = {
total: PropTypes.number,
next_text: PropTypes.string,
callback: PropTypes.func
}
module.exports = Demo;
// bad
const Listing = React.createClass({
render() {
return <div />;
}
});
// good
class Listing extends React.Component {
render() {
return <div />;
}
}
// bad
<Foo style={{ left: '20px' }} />
// good
<Foo style={{ left: "20px" }} />
// bad
<Foo/>
// very bad
<Foo />
// bad
<Foo
/>
// good
<Foo />
// bad
<Foo
bar="bar"
baz="baz" />
// good
<Foo
bar="bar"
baz="baz"
/>
* - constructor
* - componentWillMount
* - render
* - [children's construtors]
* - [children's componentWillMount and render]
* - [children's componentDidMount]
* - componentDidMount
*
* Update Phase:
* - componentWillReceiveProps (only called if parent updated)
* - shouldComponentUpdate
* - componentWillUpdate
* - render
* - [children's constructors or receive props phase]
* - componentDidUpdate
*
* - componentWillUnmount
* - [children's componentWillUnmount]
* - [children's destroyed]
* - (destroyed)
constructor
optional static methods
getChildContext
componentWillMount
componentDidMount
componentWillReceiveProps
shouldComponentUpdate
componentWillUpdate
componentDidUpdate
componentWillUnmount
clickHandlers or eventHandlers like onClickSubmit() or onChangeDescription()
getter methods for render like getSelectReason() or getFooterContent()
Optional render methods like renderNavigation() or renderProfilePicture()
render
FAQs
The npm package @beisen-platform/transfer receives a total of 4 weekly downloads. As such, @beisen-platform/transfer popularity was classified as not popular.
We found that @beisen-platform/transfer demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
NIST has failed to meet its self-imposed deadline of clearing the NVD's backlog by the end of the fiscal year. Meanwhile, CVE's awaiting analysis have increased by 33% since June.
Security News
Cloudflare has launched a setup wizard allowing users to easily create and manage a security.txt file for vulnerability disclosure on their websites.
Security News
The Socket Research team breaks down a malicious npm package targeting the legitimate DOMPurify library. It uses obfuscated code to hide that it is exfiltrating browser and crypto wallet data.