Comments (10)
Please use this.$f7
instead of window.f7
.
from framework7-template-vue-webpack.
Uncaught TypeError: Cannot read property '$7' of undefined
from framework7-template-vue-webpack.
额,你还没有理解 this 的含义,this.$f7 和 this.$$ 是挂载在 Vue 实例上的。
from framework7-template-vue-webpack.
还请指点~
from framework7-template-vue-webpack.
另外,如果我有一个common.js,里面应该怎么调用$$和window.f7呢?可能是需要在framewor7未初始化的情况下引入改js的
from framework7-template-vue-webpack.
framework7 初始化后,通过 window.f7 和 this.$f7 都可以访问到 f7 实例。这个 this 是 vue 实例的 this,所以你得在 vue 组件里面用 this。
只要 import 了 framework7,window 变量下面就会挂载几个全局方法,这个你可以通过打印 console.log(window) 来查看到底哪些方法是可用的
比如未初始化时,window.Framework7、window.Dom7、window.Template7 可用。
先自己多尝试吧。你的核心问题是为什么 window.f7 没有,那你解决问题的思路应该是打印 window 变量,看里面到底有哪些鬼东西可以用,你一打印 window 变量,自然你所有的疑问都消失了。
from framework7-template-vue-webpack.
谢谢您的指导受益匪浅
from framework7-template-vue-webpack.
还想请教一下~
//导航
for (var i = 0; i < rs.data.banners.length; i++) {
homeIndexVue.banners.push(rs.data.banners[i]);
}
Vue.nextTick(function() { //异步更新队列
console.log(homeIndexVue.banners);
new Swiper('.banner', {
pagination: '.swiper-pagination',
loop: true,
autoplay: 3000,
});
});
在这里面,banners是已经增加了元素的,但是页面无法渲染出swiper的效果,只显示一张图片。请问如何解决呢~
from framework7-template-vue-webpack.
解决啦~
Promise.resolve().then(function() {
//导航
for (var i = 0; i < rs.data.banners.length; i++) {
homeIndexVue.banners.push(rs.data.banners[i]);
}
}).then(function() {
new Swiper('.banner', {
pagination: '.swiper-pagination',
loop: true,
autoplay: 3000,
});
}).catch(function(err) {
myApp.alert(err);
});
from framework7-template-vue-webpack.
没有问题的话,记得把 issue 关闭下,方便后来的人翻阅知道问题已解决。
from framework7-template-vue-webpack.
Related Issues (20)
- How to make device back button work?
- config to use async/await in this project (Uncaught ReferenceError: regeneratorRuntime is not defined) HOT 5
- How to call method when panel is opened?
- add a service worker with global scope HOT 2
- How to re-render / redirect routes? HOT 1
- how i can user rtl ?
- how i can user rtl ?
- npm run build-prod error HOT 2
- panel-left.vue and panel-right.vue doesn't work
- Framework icons v2
- npm run build-prod error HOT 1
- android 4.4 kitkat arryr.form error HOT 1
- [Enhancement] Create Tag/Branch for Framework7-3.x.x version
- Hot reload doesn't working HOT 6
- error cordova HOT 1
- <f7-panel> Icons not showing
- index.html not showing
- npm error not available in the internal and external HOT 1
- Can not run Build-prod after update framework7 & Framework7-Vue
- Why PushAnimation Not Work?
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from framework7-template-vue-webpack.