Ví dụ về Jspreadsheet CE
Hãy xem ví dụ này trong CodeSandbox. ví dụ làm việc Show
thành phần đánh giáimport { useRef, useEffect } from "react"; import jSuites from "jsuites"; import "jsuites/dist/jsuites.css"; export default function Rating({ options }) { const ratingRef = useRef(null); useEffect(() => { jSuites.rating(ratingRef.current, options); }, [options]); return sử dụng thành phầnimport { useState } from "react"; import Rating from "./Rating"; export default function App() { const [ratingValue, setRatingValue] = useState(0); const handleRatingChange = (element, value) => { setRatingValue(parseInt(value, 10)); }; return ( <> Chúng tôi đang nỗ lực để tạo ra một plugin tốt hơn, nhưng jExcel đang được phát triển. Chúng tôi rất thích nghe ý tưởng của bạn để làm cho nó trở nên tuyệt vời. Chúng tôi vui mừng thông báo rằng các tính năng mới sẽ ra mắt hàng ngày và chúng tôi hiện đang làm việc với các tính năng như Nhiều đề xuất được chào đón. Vui lòng gửi nhận xét của bạn trong trang Github của chúng tôi Jspreadsheet CE là một plugin Vanilla JavaScript nhẹ để tạo các bảng và bảng tính HTML tương tác dựa trên web tuyệt vời tương thích với phần mềm bảng tính khác. Bạn có thể tạo bảng bảng tính trực tuyến từ mảng JS, tệp JSON, CSV hoặc XLSX. Bạn có thể sao chép từ excel và dán thẳng vào bảng tính Jspreadsheet CE của mình và ngược lại. Rất dễ dàng tích hợp bất kỳ plugin JavaScript của bên thứ ba nào để tạo các cột tùy chỉnh, trình chỉnh sửa tùy chỉnh của riêng bạn và tùy chỉnh bất kỳ tính năng nào vào ứng dụng của bạn. Jspreadsheet CE có nhiều tùy chọn đầu vào khác nhau thông qua các loại cột gốc của nó để đáp ứng các yêu cầu ứng dụng dựa trên web phổ biến nhất. Nó là một giải pháp hoàn chỉnh để quản lý dữ liệu web. Tạo các ứng dụng tuyệt vời với bảng tính JavaScript Jspreadsheet CE Jspreadsheet Pro v9 - Giải pháp thương mại
Ưu điểm chính
Ảnh chụp màn hìnhCài đặtLà gói nút
Là plugin thư viện/js độc lậpTải xuống ZIP đặt và sử dụng các tệp của thư mục Với một khuôn khổXem phần ví dụ để biết các ví dụ về mã của jspreadsheets với các khung phổ biến Bản trình diễn cơ bảnMột ví dụ cơ bản để tích hợp bảng tính JavaScript vào trang web của bạn để tạo bảng tính trực tuyến đầu tiên của bạn. https. // codepen. io/hchiam/pen/qBRzXKK Cách sử dụngThêm jexcel/jspreadsheet và jsuites vào tệp html của bạn <script src="https://bossanova.uk/jspreadsheet/v4/jexcel.js">script> <script src="https://jsuites.net/v4/jsuites.js">script> <link rel="stylesheet" href="https://jsuites.net/v4/jsuites.css" type="text/css" /> <link rel="stylesheet" href="https://bossanova.uk/jspreadsheet/v4/jexcel.css" type="text/css" /> Bạn nên khởi tạo bảng của mình dựa trên vùng chứa div, chẳng hạn như <div id="spreadsheet">div> Để khởi tạo bảng Jspreadsheet CE, bạn nên chạy JavaScript, chẳng hạn như var data = [ ['Jazz', 'Honda', '2019-02-12', '', true, '$ 2.000,00', '#777700'], ['Civic', 'Honda', '2018-07-11', '', true, '$ 4.000,01', '#007777'], ]; jspreadsheet(document.getElementById('spreadsheet'), { data:data, columns: [ { type: 'text', title:'Car', width:120 }, { type: 'dropdown', title:'Make', width:200, source:[ "Alfa Romeo", "Audi", "Bmw" ] }, { type: 'calendar', title:'Available', width:200 }, { type: 'image', title:'Photo', width:120 }, { type: 'checkbox', title:'Stock', width:80 }, { type: 'numeric', title:'Price', width:100, mask:'$ #.##,00', decimal:',' }, { type: 'color', width:100, render:'square', } ] }); Phục vụ tệp html của bạn và sau đó bạn sẽ nhận được bảng được hiển thị trong trình duyệt của mình Phát triểnXem sự phát triển ví dụ
Lịch sử CE của bảng tính JspreadsheetJspreadsheet CE 4. 6Jexcel đã được đổi tên thành Jspreadsheet Jspreadsheet CE 4. 0. 0Xin gửi lời cảm ơn đặc biệt đến sự hỗ trợ và tài trợ của FDL - Fonds de Dotation du Libre để giúp phiên bản này có thể thực hiện được với rất nhiều tính năng hay
Jspreadsheet CE 3. 9. 0 (Jexcel)
Jspreadsheet CE 3. 6. 0 (Jexcel)
Jspreadsheet CE 3. 2. 3 (Jexcel)
Jspreadsheet CE 3. 0. 1 (Jexcel)Jspreadsheet CE v3 là phiên bản JavaScript Vanilla được xây dựng lại hoàn chỉnh. Vì lý do đó, không thể giữ tương thích hoàn toàn với phiên bản trước. Nếu bạn đang nâng cấp, bạn có thể cần thực hiện một vài cập nhật trong mã của mình. Nếu thắc mắc bạn có thể xem lại bài viết nâng cấp từ Jspreadsheet CE v2 hoặc Handsontable |