Skip to content

P
pica-insurance
提交 013c5c81 编写于 作者: 张磊's avatar 张磊
浏览文件
操作

init-project

上级 ef629576
显示空白字符变更
内嵌 并排
正在显示 包含 115 行增加 和 242 行删除
src/components/HelloWorld.vue 已删除 100644 → 0
浏览文件 @ ef629576
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<p>
For a guide and recipes on how to configure / customize this project,<br>
check out the
<a
href="https://cli.vuejs.org"
target="_blank"
rel="noopener"
>vue-cli documentation</a>.
</p>
<h3>Installed CLI Plugins</h3>
<ul>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel"
target="_blank"
rel="noopener"
>babel</a>
</li>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint"
target="_blank"
rel="noopener"
>eslint</a>
</li>
</ul>
<h3>Essential Links</h3>
<ul>
<li>
<a
href="https://vuejs.org"
target="_blank"
rel="noopener"
>Core Docs</a>
</li>
<li>
<a
href="https://forum.vuejs.org"
target="_blank"
rel="noopener"
>Forum</a>
</li>
<li>
<a
href="https://chat.vuejs.org"
target="_blank"
rel="noopener"
>Community Chat</a>
</li>
<li>
<a
href="https://twitter.com/vuejs"
target="_blank"
rel="noopener"
>Twitter</a>
</li>
<li>
<a
href="https://news.vuejs.org"
target="_blank"
rel="noopener"
>News</a>
</li>
</ul>
<h3>Ecosystem</h3>
<ul>
<li>
<a
href="https://router.vuejs.org"
target="_blank"
rel="noopener"
>vue-router</a>
</li>
<li>
<a
href="https://vuex.vuejs.org"
target="_blank"
rel="noopener"
>vuex</a>
</li>
<li>
<a
href="https://github.com/vuejs/vue-devtools#vue-devtools"
target="_blank"
rel="noopener"
>vue-devtools</a>
</li>
<li>
<a
href="https://vue-loader.vuejs.org"
target="_blank"
rel="noopener"
>vue-loader</a>
</li>
<li>
<a
href="https://github.com/vuejs/awesome-vue"
target="_blank"
rel="noopener"
>awesome-vue</a>
</li>
</ul>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
props: {
msg: String
}
};
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h3 {
margin: 40px 0 0;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>
src/components/loading.js 0 → 100644
浏览文件 @ 013c5c81
import LoadingComponent from './loading.vue';
const loading = {
install: function (Vue) {
// 创建一个Vue的“子类”组件
const LoadingConstructor = Vue.extend(LoadingComponent);
// 创建一个该子类的实例,并挂载到一个元素上
const instance = new LoadingConstructor();
// 将这个实例挂载到动态创建的元素上,并将元素添加到全局结构中
instance.$mount(document.createElement('div'));
document.body.appendChild(instance.$el);
// 在Vue的原型链上注册方法，控制组件
Vue.prototype.$loading = {
show: () => {
console.log('show');
instance.show = true;
},
hide: () => {
console.log('hide');
instance.show = false;
},
};
},
show() {
console.log('show');
},
};
export default loading;
src/components/loading.vue 0 → 100644
浏览文件 @ 013c5c81
<template>
<van-popup
v-model="show"
:close-on-click-overlay="false"
style="background-color: transparent"
>
<div class="loadingWrap">
<van-loading
v-if="show"
type="spinner"
/>
</div>
</van-popup>
</template>
<script>
export default {
name: 'Loading',
data() {
return {
show: false,
};
},
};
</script>
<style lang="sass" scoped>
.loadingWrap{
::v-deep .van-popup{
background-color:rgba(0,0,0,.7);
}
}
</style>
src/main.js
浏览文件 @ 013c5c81
......@@ -2,3 +2,40 @@ import { router, store, vueApp } from '@pica-cli/vue-cli-plugin-pica-cli-plugin/
import '@/router';
console.log('router, store, vueApp: ', router, store, vueApp);
const { Vue } = window;
import Loading from '@/components/loading.js';
Vue.use(Loading);
// 禁用双指放大
var lastTouchEnd = 0;
document.addEventListener('touchstart', function (event) {
if (event.touches.length > 1) {
event.preventDefault();
}
});
document.addEventListener(
'touchend',
function (event) {
var now = new Date().getTime();
if (now - lastTouchEnd <= 300) {
event.preventDefault();
}
lastTouchEnd = now;
},
false
);
document.documentElement.addEventListener(
'touchstart',
function (event) {
if (event.touches.length > 1) {
event.preventDefault();
}
},
{
passive: false,
}
);
vueApp.$rocNative.appInit();
console.log('router, store, vueApp: ', router, store, vueApp);
console.log('window :>> ', window);
src/plugins/router-config.js
浏览文件 @ 013c5c81
/**
* @name: router-config
* @author: alan
* @date: 2022-01-04 19:29
* @description：router-config
* @update: 2022-01-04 19:29
*/
export default {
scrollBehavior(to, from, savedPosition) {
if (savedPosition && to.meta.keepAlive) {
return savedPosition;
}
return { x: 0, y: 0 };
},
};
src/plugins/vue-components.js
浏览文件 @ 013c5c81
/**
* @name: vue-component
* @author: alan
* @date: 2021-11-16 18:03
* @description：vue-component
* @update: 2021-11-16 18:03
*/
import Vue from 'vue';
import PageModel from '@pica-kit/page-model';
Vue.use(PageModel);
import picaGuideApp from '@pica-kit/pica-ui-component/lib/pica-guide-app';
Vue.use(picaGuideApp);
src/plugins/vue-inject.js
浏览文件 @ 013c5c81
......@@ -7,10 +7,10 @@
*/
import Vue from 'vue';
import WebBuriedPoint, {sendBuriedData} from '@pica-core/web-buried-point';
import picaBridge from '@pica-core/JsBridge';
const {name} = require('../../package.json');
Vue.prototype.$sendBuriedData = sendBuriedData;
Vue.prototype.$rocNative = new picaBridge();
Vue.use(WebBuriedPoint, {
class_name: name,
url: `${process.env.VUE_APP_SERVICE_URL}/file/log/trace1`,
......
src/views/README.MD 已删除 100644 → 0
浏览文件 @ ef629576
该目录下放置需要路由的页面
> 如开启自动创建路由配置，则会自动把该目录的vue文件自动配置到routers。
#### 以__（两个下划线，例如__foo __.vue）开头和结尾的目录和文件将被忽略。
例如：
```
views/
├── __partial__.vue
├── index.vue
├── users.vue
└── users/
└── _id.vue
```
自动生成路由：
```js
export default [
{
name: 'index',
path: '/',
component: () => import('@/views/index.vue')
},
{
name: 'users',
path: '/users',
component: () => import('@/views/users.vue'),
children: [
{
name: 'users-id',
path: ':id?',
component: () => import('@/views/users/_id.vue')
}
]
}
]
```
如果路由页面采用分文件方式：template 为.vue文件，scss为样式等：
```
views/
└── users/
└── index.vue
```
自动生成路由：
```js
export default [
{
name: 'users',
path: '/users',
component: () => import('@/views/users/index.vue')
}
]
```
如果要使路由参数为必须，则创建一个该参数的目录，然后在该目录中添加`index.vue`。 在上面的示例中，如果将`users/_id.vue`替换为`users/_id/index.vue`，则需要：`id`参数。
### <route> 自定义标签块
如果页面组件有<route>自定义标签块，则该标签内的内容json将与route config合并。
例如，如果index.vue具有以下<route>块：
```vue
<route>
{
"name": "home",
"meta": {
"requiresAuth": true
}
}
</route>
<template>
<h1>Hello</h1>
</template>
```
生成的路由配置如下:
```js
module.exports = [
{
name: 'home',
path: '/',
component: () => import('@/views/index.vue'),
meta: {
requiresAuth: true
}
}
]
```
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或