Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!doctype html5>
<html>
    <head>
        <meta charset='UTF-8' />
        <title>Example</title>
​
        <!-- Uncomment for DEV mode: -->
        <!-- <script src="https://cdn.jsdelivr.net/npm/vue@3.0.0-beta.14/dist/vue.global.js"></script>  -->
        <!-- PROD: -->
        <script src="https://cdn.jsdelivr.net/npm/vue@3.0.0-beta.14/dist/vue.global.prod.js"></script>
        <!-- -->
    </head>
    <body>
        <div id="app">
            <div v-if="!loading">
                <h3>Table</h3>
            </div>
​
            <!-- loading -->
            <div v-else>
                This should be hidden
            </div>    
        </div>
    </body>
​
    <script>
    const { createApp, computed, ref, reactive, toRefs, onMounted } = Vue;
​
    let App = {
        setup: function () {
            const appData = reactive({
                loading: false
            });
​
            return {
                ...toRefs(appData),
            };
        },
    };
​
    var app = createApp(App).mount('#app');
    </script>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers