Sencha Ext JS5의 전자 시드
http://www.adventar.org/calendars/490
전자 피드 선택 모델
안녕하세요, xenophy의 간정입니다.
며칠 전에 Ext JS5.1이 출시되었습니다.
몇 가지 새로운 기능이 추가되었지만, 이번에는 그 중에서
스프레드시트처럼 격자선을 조작할 수 있습니다.
나는 전자 피드 선택 모델을 사용하고 싶다.
메쉬 작성
스프레드시트 선택 모드는 격자선 설정
selModel
에 사용됩니다.따라서 먼저 기본 격자를 다음과 같이 만듭니다.
Ext.create('Ext.grid.Panel', {
renderTo: Ext.getBody(),
title: 'スプレッドシート',
width: 250,
columns: [
{text: 'A', dataIndex: 'a', width: 50},
{text: 'B', dataIndex: 'b', width: 50},
{text: 'C', dataIndex: 'c', width: 50},
{text: 'D', dataIndex: 'd', width: 50},
{text: 'E', dataIndex: 'e', width: 50}
],
store: {
fields: [{
name: 'a',
type: 'string'
}, {
name: 'b',
type: 'string'
}, {
name: 'c',
type: 'string'
}],
data: [
{a: 'A-1', b: 'B-1', c: 'C-1', d: 'D-1', e: 'E-1'},
{a: 'A-2', b: 'B-2', c: 'C-2', d: 'D-2', e: 'E-2'},
{a: 'A-3', b: 'B-3', c: 'C-3', d: 'D-3', e: 'E-3'},
{a: 'A-4', b: 'B-4', c: 'C-4', d: 'D-4', e: 'E-4'},
{a: 'A-5', b: 'B-5', c: 'C-5', d: 'D-5', e: 'E-5'}
]
}
});
아직 일반 메쉬이므로 기본적으로 행이 선택됩니다.
전자 시드 선택 모델 설정하기
를 참고하십시오.
다음은 Requires가 SpreadsheetModel류를 이용할 수 있는
selModel의 type에 "spreadsheet" 이 지정되어 있습니다.
또한columnSelect는 정말입니다. 모든 열을 선택할 수 있습니다.
requires: [
'Ext.grid.selection.SpreadsheetModel'
],
selModel: {
type: 'spreadsheet',
columnSelect: true
},
위의 설정만으로 스프레드시트와 같은 열 또는 행을 가로지릅니다.
열을 선택할 수 있습니다.
클립보드 플러그인
전자 시드 선택 모델이 설정된 메쉬의 경우
클립보드 플러그인을 사용하여 격자에서 선택한 칸을
클립보드에 쉽게 저장할 수 있습니다.
다음 Requires와plugens를 추가합니다.
requires: [
'Ext.grid.selection.SpreadsheetModel',
'Ext.grid.plugin.Clipboard'
],
selModel: {
type: 'spreadsheet',
columnSelect: true
},
plugins: 'clipboard',
방금 격자에 있는 칸을 선택하고 복사한 결과는 다음과 같습니다.
붙여넣기 결과
A-2 B-2 C-2 D-2
A-3 B-3 C-3 D-3
A-4 B-4 C-4 D-4
최후
지금까지 힘들게 설치했던 기능이 Ext JS5로 바뀌면서 계속 추가되고 있습니다.
이번 전자 피드 선택 모드와 클립보드 플러그인 등
Ext JS의 데스크톱 응용 프로그램에서 유용성이 향상되었다고 생각합니다. ※ 이번 센샤 피델입니다. https://fiddle.sencha.com/#fiddle/ffo 내일은 @martini3oz입니다.
Reference
이 문제에 관하여(Sencha Ext JS5의 전자 시드), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/sugaimasaru/items/7283e4639ae40d5ca14c텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)