template.html 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. <div v-scope="About({count:2})">
  2. <p>{{count}}</p><button @click="inc">increment</button>
  3. </div>
  4. <div v-scope="Home({count:1})">
  5. <p>{{count}}</p><button @click="inc">increment</button>
  6. </div>
  7. <script src="/plugins/vue/petite-vue.iife.js"></script>
  8. <script src="/plugins/axios/axios.min.js"></script>
  9. <script>
  10. function Home(props) {
  11. return {
  12. count: props.count,
  13. inc() { this.count++; }
  14. }
  15. }
  16. function About(props) {
  17. return {
  18. count: props.count,
  19. inc() {
  20. that = this;
  21. // 向给定ID的用户发起请求
  22. axios.get('/plugins/vue/petite-vue.iife.js')
  23. .then(function (response) {
  24. // 处理成功情况
  25. //console.log(response);
  26. that.count++;
  27. })
  28. .catch(function (error) {
  29. // 处理错误情况
  30. //console.log(error);
  31. })
  32. .then(function () {
  33. // 总是会执行
  34. });
  35. }
  36. }
  37. }
  38. PetiteVue.createApp({ Home, About }).mount();
  39. </script>