Vue中setup函数

介绍

Vue3中使用setup函数取代methods和data

效果

Vue中setup函数_第1张图片

代码

DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>lesson 34title>
  <script src="https://unpkg.com/vue@next">script>
head>
<body>
  <div id="root">div>
body>
<script>
  // 对数据做校验的插件
  const app = Vue.createApp({
    template: `
      
{{name}}
`
, methods: { test() { console.log(this.$options.setup()); } }, mounted() { this.test(); }, // created 实例被完全初始化之前 setup(props, context) { return { name: 'dell', handleClick: () => { alert(123) } } } }); const vm = app.mount('#root');
script> html>

你可能感兴趣的:(VUE,vue.js,前端,javascript)