Skip to content

Commit

Permalink
update demo with pull request sql-js#3 with sample sqlite databases
Browse files Browse the repository at this point in the history
  • Loading branch information
zmwm37 committed Apr 28, 2021
1 parent 4e7d90e commit f59bcf7
Show file tree
Hide file tree
Showing 6 changed files with 28 additions and 20 deletions.
18 changes: 4 additions & 14 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
},
"devDependencies": {
"copy-webpack-plugin": "^5.1.1",
"react-app-rewired": "^2.1.5",
"react-app-rewired": "^2.1.8",
"typescript": "3.3.3"
},
"scripts": {
Expand Down
Binary file added public/test.db
Binary file not shown.
Binary file added public/z_test.db
Binary file not shown.
19 changes: 14 additions & 5 deletions src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,22 +14,30 @@ export default class App extends React.Component {
// sql.js needs to fetch its wasm file, so we cannot immediately instantiate the database
// without any configuration, initSqlJs will fetch the wasm files directly from the same path as the js
// see ../config-overrides.js
initSqlJs()
.then(SQL => this.setState({ db: new SQL.Database() }))
.catch(err => this.setState({ err }));
const me = this;
Promise.all([initSqlJs(), fetch('./z_test.db')]).then(async res => {
const SQLite = res[0], dbStorage = res[1];
const db = new SQLite.Database(new Uint8Array(await dbStorage.arrayBuffer()));

me.setState({db: db});
}).catch(err => {
me.setState({err});
});
}

exec(sql) {
let results = null, err = null;
try {
// The sql is executed synchronously on the UI thread.
// The sql is executed synchronously on the UI thread.
// You may want to use a web worker
results = this.state.db.exec(sql); // an array of objects is returned
} catch (e) {
// exec throws an error when the SQL statement is invalid
err = e
}
this.setState({ results, err })
console.log('results')
console.log(results)
}

/**
Expand Down Expand Up @@ -70,7 +78,8 @@ export default class App extends React.Component {
<textarea
onChange={e => this.exec(e.target.value)}
placeholder="Enter some SQL. No inspiration ? Try “select sqlite_version()”"
></textarea>
defaultValue="SELECT * FROM table1"
/>

<pre className="error">{(err || "").toString()}</pre>

Expand Down
9 changes: 9 additions & 0 deletions z_test.sql
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
.open C:/path/to/test.db;

create table table1(
var1 varchar(10),
var2 smallint);

insert into table1 values ('A', 1);
insert into table1 values ('B', 2);

0 comments on commit f59bcf7

Please sign in to comment.